查阅了不少文章:
- 彬GO的 CSS代码命名惯例语义化的方法
- cssforest的讨论 CSS类命名的语义化VS结构化方式
但是还是无法得到满意的答案。举个例子,一个左浮动的文字描述。
<!-- 根据结构化,我们可以如下:(要改的话就改CSS文件 --> <span class="desc"></span> .desc { float: left; } <!-- 但根据一般CSS框架,也可以如下:(要改的话就改Class命名 --> <span class="flo-l"></span> .flo-l { float: left; }
前者修改样式更方便,但不利于抽象化复用;后者抽象化复用更好,但改HTML相对复杂。感觉各有各的道理,却无法解决对方的问题。
请问,这个问题要如何抉择呢?如果结合使用,要如何把握程度呢?
这种问题没有最佳实践,肯定具有两面性,不要试图从中做出选择。
如果这个desc放在一个地方可以left,而放在另外一个地方可以right,那么就像bootstrap一样,重新定义几个工具类,类似.pull-left和.pull-right之类的
class="desc pull-left"
或者class="desc pull-right"
补充一下,我会把float:left写在desc里,然后desc需要float:right的时候,我会一起使用class="desc pull-right"