CSS - 哪种方法更好？

哪种处理时间更好，但考虑到开发人员的易用性？CSS - 哪种方法更好？

.font_small{ font-size:10px; } 
.font_blue{ color:blue; } 
.font_red{ color:red; } 

<span class="font_small font_blue">Hello World!</span><br /> 
<span class="font_small font_red">Today's the day!</span>

.font_blue_small{ color:blue; } 
.font_red_small{ color:red; } 

.font_blue_small .font_red_small { font-size:10px; } 

<span class="font_blue_small">Hello World!</span><br /> 
<span class="font_red_small">Today's the day!</span>

.font_blue_small{ color:blue; font-size:10px; } 
.font_red_small{ color:red; font-size:10px; } 

<span class="font_blue_small">Hello World!</span><br /> 
<span class="font_red_small">Today's the day!</span>

另一种选择我没有，虽然的又...？

来源

2010-03-26 Joe

我认为你的意思是'.font_blue_small，.font_red_small'（带逗号），因为没有它，它就会定义何时出现在其他元素内部。不过，我们知道你的意思。 :-) – amphetamachine 2010-03-26 02:38:31

哎呀错过了thnx – Joe 2010-03-26 03:06:40

第一个允许更多的灵活性和代码可重用性。

来源

2010-03-26 02:25:40 jps

对于你的例子，我会去第一个。

我会认为这只是一个例子 - 在现实的用法，要真正使用描述性的类名：

<span class="greeting">Hello world!</span> 
<span class="motd">Today's the day!</span>

使用类这样的，这是不太可能，你会需要结合类名称，因此，这个问题很少出现。现在，鉴于HTML，我会选择第二个还是第三个选项，具体取决于两个类共享多少个规则。

来源

2010-03-26 02:29:27 nickf

除非您的页面有数以万计的DOM节点嵌套数百个深度，否则上述CSS规则的差异不会影响渲染时间。如果您担心下载时间的字节大小，那么最好使用像CSSMin这样的压缩器，而不是像第二个和第三个示例一样尝试并组合类。

简而言之，与第一个一起工作，因为它对于实施来说更简洁，并且不太可能存在性能差异。但是使用像Rimian和nickf这样的描述性类名称。

来源

2010-03-26 02:32:04 Annie

其中没有一个:)

把你的css类名实现出来。如果你把蓝色变成绿色怎么办？如果你想改变不是字体的颜色，该怎么办？

来源

2010-03-26 02:32:12 Rimian

是的，我忘了更新的例子。我记得我不应该这样做，哈哈 – Joe 2010-03-26 02:34:53

.small { font-size:10px; } 
.blue { color:blue; } 
.red { color:red; } 

<span class="small blue">Hello World!</span><br /> 
<span class="small red">Today's the day!</span>

但尝试使用更好的名称为您的类，如“maintitle”，“teaser”，“信息”，“标题”等蓝色不好。如果客户下周要绿色或红色怎么办？

更好地使用“元命名”，所以命名之后，它应该显示什么。

来源

2010-03-26 02:36:30 BerggreenDK

CSS - 哪种方法更好？

回答

相关问题