没法设计出令人惊艳的Web页面时,就使用垂直韵律让它中规中矩吧!
在讲述了Sass的基本语法后,本书的着重点在于使用Compass实现网格布局、文本排版、CSS3特性、精灵、config.rb文件配置、样式表调优、以及扩展分发。
用compass/typography目录下的_vertical_rhythm.scss管理垂直韵律(行与行之间内容的留白),我解决了页面文本排版乱杂无章的问题。
Compass方便了大家在CSS中引用图片资源、合成CSS sprites以及data URI,但我个人更倾向于使用SVG sprites 代替CSS sprites(推荐Font Awesome的服务)。
文摘
我们需要从人的角度考虑问题,人们怎样编写程序或者怎样使用机器上的应用程序。我们是主人,它们是仆人。
—松本行弘
类名具有语义化含义,混合器则是作为一种展示性描述。判断一组属性是否应该组合成一个混合器,一条经验法则就是——能否为这些属性取一个描述性的名字。
继承应建立在语义化的关系上,它遵从CSS层叠规则,与混合器相比,继承生成的CSS代码相对更少。值得注意的是:尽量不要使用后代选择器去继承CSS规则。
CSS网格布局的核心由容器、列、槽构成。
术语名 |
定义 |
是否涉及HTML标签 |
---|---|---|
容器 |
构成一个网格布局的HTML元素 |
是 |
列 |
内容度量的垂直单位 |
否 |
槽 |
网格布局中列与列之间的统一留白 |
否 |
源码控制的最佳实践表明:非手工编辑的生成文件不应该出现在源码控制中,如:编译生成的CSS文件。