可扩展、模块化CSS--主题样式规则(翻译文)

SMACSS is becoming one of the most useful contributions to front-end discussions in years

很多项目可能并不需要主题这个样式，因为并不是样式的核心。然而一些网站是需要的，比如雅虎邮箱。

主题

把主题定义为网站或者APP需要看的颜色和图也许是很自然的。所以单独的把主题分开来进行选择和使用是很好的。
主题会影响原始布局，和默认样式一样的渲染页面，并且它覆盖基本颜色。改变基本颜色，改变整个感官。
现在假如说你有一个对话模块，它需要一个蓝色边框。模块本身初始会有一个边框样式，主题定义它的颜色。

.mod {
    border: 1px solid;
}

// in theme.css
.mod {
    border-color: blue;
}

主题可以有类名，它清晰的指出，元素应该是怎么样的。只要我们把主题分离的够好就会更多样。像雅虎邮箱就有超过50种主题文件来综合各种想要的颜色和图片。

排印

最后但不是最重要的，有一个字体样式，类似于主题。有些时候你需要大范围的重新定义正在使用的字体并且国际化等。中国和韩国等地区复杂的表意文字,是难以阅读小字体大小。因此,我们为每个地区创建单独的字体文件,重新定义这些组件的字体大小。字体规则通常会影响基础模块和风格。字体样式通常不会被指定在布局层次布局用于定位和布局,风格变化不像字体和颜色。像主题文件,可能没有实际需要定义字体类(如f-large)。你的网站应该只有3到6不同的字体。如果你有超过6字体大小宣布在您的项目中,您的用户可能不会注意到你的网站，也更难维护。

原文地址：https://smacss.com/