回顾

　　在上一篇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:;

padding:;

}

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的更多相关文章

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

    本篇笔者要介绍的是Layout Rules.看完本篇,大家将会知道Layout Rules的作用,以及哪些CSS应该归类为Layout Rules. 什么是Layout Rules? Layout R ...

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

    什么是SMACSS? SMACSS(发音"smacks"),全称Scalable and Modular Architecture for CSS.顾名思义,SMACSS是一个可扩 ...

  3. Vue中CSS模块化最佳实践

    Vue风格指南中介绍了单文件组件中的Style是必须要有作用域的,否则组件之间可能相互影响,造成难以调试. 在Vue Loader Scope CSS和Vue Loader CSS Modules两节 ...

  4. CSS规范 - 最佳实践--（来自网易）

    最佳选择器写法(模块) /* 这是某个模块 */ .m-nav{}/* 模块容器 */ .m-nav li,.m-nav a{}/* 先共性 优化组合 */ .m-nav li{}/* 后个性 语义化 ...

  5. 最重要的 Java EE 最佳实践

    參考:IBM WebSphere 开发人员技术期刊: 最重要的 Java EE 最佳实践 IBM WebSphere 开发人员技术期刊: 最重要的 Java EE 最佳实践 2004 年 IBM® W ...

  6. Git 最佳实践：分支管理

    5月份,为统一团队git分支管理规范,刚开始准备自己写,在网上搜了下,发现不少不错的git分支管理实践.最后我为团队选择了这个git分支管理实践 A successful Git branching ...

  7. SpringBoot系列: Spring项目异常处理最佳实践

    ===================================自定义异常类===================================稍具规模的项目, 一般都要自定义一组异常类, 这 ...

  8. MaxCompute 构建企业云数据仓库CDW的最佳实践建议

    在本文中阿里云资深产品专家云郎分享了基于阿里云 MaxCompute 构建企业云数据仓库CDW的最佳实践建议. 本文内容根据演讲视频以及PPT整理而成. 大家下午好,我是云郎,之前在甲骨文做企业架构师 ...

  9. 使用DataStax Java驱动程序的最佳实践

    引言 如果您想开始建立自己的基于Cassandra的Java程序,欢迎! 也许您已经参加过我们精彩的DataStax Academy课程或开发者大会,又或者仔细阅读过Cassandra Java驱动的 ...

随机推荐

  1. 【java】静态方法声明与调用习题

    public class dengd { static int getTt(int table[]) { for(int b=0; b<table.length;b++) { System.ou ...

  2. linux----定义命令别名

    1.定义命令别名的语法: alias nickName='command'#用于定义. unalias  nickName#用于撤消一个别名的定义. 如:alias cls='clear' 2.应该要 ...

  3. cad实时平移快捷键

    1.按住鼠标滚轮,光标变成小手工具,可拖动画布 2.键盘按 p,光标变成小手工具

  4. 转:web前端面试题合集 (Javascript相关)（js异步加载详解）

    1. HTTP协议的状态消息都有哪些? 1**:请求收到,继续处理2**:操作成功收到,分析.接受3**:完成此请求必须进一步处理4**:请求包含一个错误语法或不能完成5**:服务器执行一个完全有效请 ...

  5. perl 分析binlog 定位错误sql 思路

    1. 获取需要的binlog 日志: [root@zjzc01 binlog]# mysqlbinlog --start-datetime='2016-08-01 00:00:00' --stop-d ...

  6. css之float

    在 HTML中的所有对象,默认分为两种:块元素(block element).内联元素(inline element),虽然也存在着可变元素,但只是随上下文关系确定该元素是块元素或者内联元素. 其实C ...

  7. C++ ofstream和ifstream

    ofstream是从内存到硬盘,ifstream是从硬盘到内存,其实所谓的流缓冲就是内存空间; 在C++中,有一个stream这个类,所有的I/O都以这个“流”类为基础的,包括我们要认识的文件I/O, ...

  8. DataTable 修改列名 删除列 调整列顺序

    DataTable myDt =dt;//删除列myDt.Columns.Remove("minArea");myDt.Columns.Remove("maxArea&q ...

  9. hive 分配map数过少导致任务执行慢

    数据表大概150M,但是只有几个字段,导致行数特别多,当使用正则表达式去匹配时执行较慢. 解决思路:增大map数; //设置reduce数为150,将原表分成150份,map数无法直接设置,因为和输入 ...

  10. Unity5UGUI 官方教程学习笔记（二）Rect Transform

    Rect Transform Posx    Posy   Posz  :  ui相对于父级的位置 Anchors :锚点  定义了与父体之间的位置关系    一个锚点由四个锚组成  四个锚分别代表了 ...