基金会SASS/SCSS变量

Question

我想从Bootstrap移到Zurb基金会。

引导程序使用* -color表示文本颜色，* -bg表示背景颜色。

我有点困惑与基金会的命名方案：

是什么$topbar-link-bg-hover和$topbar-link-bg-color-hover之间的区别？

他们的名字都表明他们改变了顶栏中链接的背景颜色，两者都被赋予了颜色。

Answer 1

基金会的结构有很多细节，如果你在基金会搜索这些变量，你可以在_top-bar.scss文件中找到它们。看着它，如何使用这些变量：

// Apply the hover link color when it has that class 
&:hover:not(.has-form) > a { 
    background-color: $topbar-link-bg-color-hover; 

    @if ($topbar-link-bg-hover) { 
     background: $topbar-link-bg-hover; 
    } 
} 

$topbar-link-bg-color-hover值可以用颜色相同的，因为使用了background-color和$topbar-link-bg-hover值可以用图像或其他任何东西（CSS背景值）相等。