CSS: 试试,然后做的更好

382 查看

你有没有担心过自己写的 CSS 都错了?有没有想过会错过一些让一切变得更好更简单的新方法?是不是想在 CSS 方面更有自信呢?

那在这方面你和 Anna 肯定感同身受:

我的 CSS充满了自我怀疑。现在 class 使用什么样的名字系统更合适呢?以后什么又是最好的?什么是差的?

——Anna Debenham (@anna_debenham) November 13, 2014

如果你也写了很多 CSS,但是从来没有过这样的疑虑,那么就比较令人担心了。要么就是你顶级聪明,要么,呵呵,你懂的

我最近写 CSS 的方法是:尽管尝试,做的更好。我不是想要宣扬特殊的方法论或者严格的规则。这更像是一些宽松的法则,保证事情在可控的范围内,积极地尝试,然后做的更好一些。

警告:这是我个人的方法。我工作的项目几乎只有我自己负责 CSS。从最近 css-tricks 上的投票来看,其中55%也同样适用于你。我推测,和你一起工作的人越多,我的建议的作用就越小。 //译注:原文 csstricks 网站边栏有一个投票。

以下就是详细的法则:

不要懒惰。你什么时候偷懒了,自己心里都清楚。比如对某个问题你喜欢草草的快速修正,而不是彻底了解这个问题。或者是哪个文件看起来合适就立马将 CSS 放进去而不是想想它到底该放在哪里。又或者是当某个场景明显需要新的模式时你却背道而驰。

使用你喜欢的方式。知道吗?在模块中我喜欢光明正大地使用子选择器。.module > h2这种形式经常出现在我的 CSS 中。严格的方法论肯定不支持这种做法,但是我可不管。在它出错之前,我会一直这么使用,但是到现在为止都是对的。如果它出错了,我再改。原因正如我之前所提到的。

用你喜欢的方式进行命名。如果让我根据某个规则来命名,我脑子里肯定会一团糟。我应该会花上一两天的时间来接受这个规则,并且重新进行管理。我们的项目完全是根据我自己的爱好进行命名的。总体上来说,我感到更自在,更高效。

使用自己觉得高效的工具。我不会推荐什么工具,因为好的工具是因人而异的。如果我觉得某个工具很有用,我就会去用。只要它能节省时间,做出更好地效果,更好地组织,解决性能问题,自动做出最佳选择,不管它是什么,我用了。

有一条原则是我一直以来坚信的:在整个项目中保持选择器的低特异性。结合 Harry 的特异性图表可以很好地理解这句话。特异性是会逐渐升高的,因此要防止一开始就产生高特异性,否则它会很快成为一个问题。可以考虑多用:.class{}

有目的性地重新访问页面的各个部分。目的不仅仅是检查各个部分的 CSS 良好,还要试图做的更好,适用于大多数人。我发现每次我重新访问一个地方,都是做最后润色的一个机会,这让我对旧代码更有自信。