网页页面设计的细节 更优雅的设计网页(3)

外观与CSS

CSS本身很容易写，但合理的CSS架构却不是一个简单的事情。要保持CSS的可维护性，最简单的做法就是追求CSS的复用性，尽可能减少CSS量。

任何时候，都要写CSS注释
CSS一般来说可读性较差，因此需要我们多写CSS注释。注释内容越丰富和细致越好，而且建议结合ASCII Art（字符画）。如果有时间，甚至可以在一个CSS文件中写一个目录。

如果是后续增加更改，还可以附上时间和项目相关信息，这在多人协作中很有用。

优雅的CSS选择器

优雅的CSS选择器不仅看起来亲切，而且也可以提升浏览器的样式渲染效率。
主要使用类名（CLASS）作为选择符，不做额外的限定。

上图中下一种写法更好是因为非<p>标签元素也有效，标签可以随意替换，而且样式渲染时更加高效。

避免不必要的继承关系。继承写法是为了避免相同命名的选择符的样式相互影响，但在层级使用上要注意适度。

浏览器样式渲染引擎是按照从右向左的顺序来解析CSS选择器，最右边的选择符称为关键选择符（Key Selector），每一个额外的继承选择符都会增加样式渲染引擎的查找匹配时间。而且，如果没有额外的继承关系，子元素会有更好的重用性。

总结

在实际的经历中，我们开发者所遵循的，主要是在经验积累中的成果，称为“最佳实践”。在心中明确这样一种“最佳实践”的理念，就可以帮助自己培养良好的习惯，在页面书写上做得更加自然，更加“优雅”。

期待和各位前端开发者共同进步！