SMACSS:一个关于CSS的最佳实践-2.Base Rules

标签：

回顾

　　在上一篇SMACSS:一个关于CSS的最佳实践-Overview中，讲到SMACSS将CSS Rules分为5个Categories:

1. Base
2. Layout
3. Module
4. State
5. Theme

本篇我们将介绍Base Rules。你可以将所有Base Rules放在一个文件，比如 base.css ；当然，也可以不这么做。区分Category的作用是帮助我们区分出不同功能的CSS，提高可重用性，可维护性。

哪些CSS属于Base Rules?

　　Base Rules指的是所有元素的默认styles，比如说默认的link style，font styles，body backgrounds等等，也可以理解为为了屏蔽浏览器的差异，而对所有元素重新定义的一类CSS。 Normalize.css 和 Reset.css 是典型的Base Rules。笔者建议以 Normalize.css 为基础，根据自己的实际情况添加，形成自己的 base.css 。

Base styles例子

body, form {
margin: 0;
padding: 0;
}
a {
color: #039;
}
a:hover {
color: #03F;
}

Base Rules最佳实践

　　根据Base Rules的定义，我们可以很容易的理解如下最佳实践。

　　Base Rules可以出现如下CSS选择符：

1. element selector
2. descendant selector
3. child selector
4. pseudo selector

　　相反，以下选择符不应该出现在Base Rules中：

1. class selector
2. ID selector
3. !important

　　如果违背了上述最佳实践，那么显然，你应该仔细回忆下Base Rules的定义，并再次确认究竟哪些CSS应该放在Base Rules下面。

相关阅读

　　上一章 SMACSS:一个关于CSS的最佳实践-1.Overview

　　下一章 SMACSS:一个关于CSS的最佳实践-3.Layout Rules

　　若觉得文章写得不错，请点击下方的推荐支持一下博主，谢谢！

SMACSS:一个关于CSS的最佳实践-2.Base Rules

标签：

原文地址：http://www.cnblogs.com/majiangl/p/smacss-base-rules.html