回顾

  在上一篇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. Some good questions

    (一)#include <stdio.h>#include <stdlib.h>void getmemory(char *p){ p=(char *) malloc(100); ...

  2. linux 关于动态库的知识

    问题起缘于编译一个程序时,使用glib2-2.28.8的动态库,而系统自带的是glib2-2.22.5 不想升级系统的glib2库,而使用程序自带库文件的方式加载(类似windows系统,优先加载当前 ...

  3. OSG报警特效学习总结

    方法一:粒子系统         OSG的粒子系统有自己定义好的模块,如osgParticle::ExplosionEffect(爆炸模拟):osgParticle::SmokeEffect(烟雾模拟 ...

  4. Ubuntu 12.04 Android2.2源码make** /classes-full-debug.jar Error 41错误解决

    出现make: *** [out/target/common/obj/APPS/CMParts_intermediates/classes-full-debug.jar] Error 41这样的错误最 ...

  5. 利用OpenCV和MFC对话框建设一个有滑动条控制的播放器--转

    (一)问题的提出: OpenCV有一个很简单的播放视频文件并加载滑动条的程序,但是如何用MFC对话框来创建一个有滑动条控制的播放器呢,网络上四处搜索都没有代码可以参考,下的都是些骗子链接文件,很过分, ...

  6. python之lambda表达式

    lambda函数小结 1.lambda表达式: 以前看人家写一个长式子就能干一件我写一个函数干的事情觉得好帅,现在通过学习知道了lambda表达式其原理就是一个函数,而且是一个只能处理简单功能的函数. ...

  7. iOS点滴- ViewController详解

    一.生命周期 当一个视图控制器被创建,并在屏幕上显示的时候. 代码的执行顺序 1. alloc                              创建对象,分配空间 2.init (initW ...

  8. English - even though和even if用法解析

    even though和even if的用法区别两者均可用于引导让步状语从句,其细微区别是: 1. even if 引导的从句是往往是假设性的,相当于汉语的“即使”“纵然”“就算”“哪怕”. 如:Th ...

  9. SQL Server 中的跨库视图

    SQL Server 中的跨库视图 在一个SQL中,有多个数据库,A.B.C,在使用C为连接库中,现在要查询A中的表T1. 那么,在C中建创视图(A_T1). SELECT *FROM A.dbo.T ...

  10. vs vsvim viemu vax 备忘

    使用gt和gT往返标签 gd:到达光标所在处函数或者变量的定义处. *:读取光标处的字符串,并且移动光标到它再次出现的地方. #:和上面的类似,但是是往反方向寻找. /text:从当前光标处开始搜索字 ...