驯服CSS选择器

一段路旁,地瓜叶正茂密地延伸着手脚,棱角分明的叶子颇有生趣,纵横交错的长藤生长着密密匝匝的叶子,团团簇簇地拥挤在一起,生机勃勃。绿色在膨胀,触目不由得一阵舒服,在感叹大自然植物的神奇与美妙里,也感谢阳光的无私赠与。
  • PPT:Taming CSS Selectors
  • 作者:Nicole Sullivan
  • 翻译:ytzong

CSS 文件的大小和所引起的 HTTP 的请求数

是 CSS 性能的最关键因素

回流(reflow)和渲染时间

(非常!)没那么重要

副本(duplication)比陈旧的规则(stale rules)更糟糕

因为我们有工具处理后者

定义缺省值

不要在每处都重复编码

不好的:

#weatherModule h3{color:red;}
#tabs h3{color:blue;}

推荐:

h1, .h1{...}
h2, .h2{...}
h3, .h3{...}
h4, .h4{...}
h5, .h5{...}
h6, .h6{...}

用单独的 class 来定义结构

不要在每处都重复编码

使用 class

而不是元素选择器

不好的:

div.error{...}

推荐:

.error{绝大多数代码写在这里}
div.error{单独定义}
p.error{单独定义}
em.error{单独定义}

上一页12 下一页 阅读全文

到此这篇关于驯服CSS选择器就介绍到这了。我们为人做事,切勿处处求全责备样样希求精通,要充分认识自己和自已所从事的工作,客观地分析问题,珍惜自己的拥有,一步一个脚印向前走。更多相关驯服CSS选择器内容请查看相关栏目,小编编辑不易,再次感谢大家的支持!

您可能有感兴趣的文章
CSS复合选择器的具体如何使用方法

CSS3 新增选择器的实例

CSS 样式的如何使用方式、选择器

css3 伪类选择器快速复习小结

如何使用CSS属性选择器来拼接HTML的DNA的方法