Question

请帮我确定哪种方法更好（在html标签中有2个类或者在同一属性中有2个类）以及为什么？

方法1

<html><body>
     <p class="redColor buttonHeight"> button Red</p>
     <p class="blueColor buttonHeight"> button Blue</p>
    </body></html>

    .redColor{color:red}
    .blueColor{color:blue}
    .buttonHeight{height:10px}

方法2

<html><body>
 <p class="redColorHeight"> button Red</p>
 <p class="blueColorHeight"> button Blue</p>
</body></html>

.redColorHeight{color:red}
.blueColorHeight{color:blue}
.redColorHeight,.blueColorHeight{height:10px;}

Answer 1

尝试让您的课程更加通用，并为他们提供隐含其目的的名称，而不是其实施，例如button-important和button-info。以redButton这样非常具体的名称调用CSS类并不是一个好习惯。

我相信这是一种更好的做法：

 <p class="button button-important"> button Red</p>
 <p class="button button-info"> button Blue</p>

.button {
    height: 10px;
}
.button-important {
    color: red;
}
.button-info {
    color: blue;
}

Answer 2

所有关于要提取哪些属性的常见问题。例如。如果您应用中的所有按钮应该是相同的高度，请使用Itay建议的方法。将高度def放在按钮类的样式中。如果不是这种情况，并且您不希望它们保持完全相同的高度，则可以使用第二种方法。

Css为我们提供了一个课程，我们应该将它们用作课程。我的意思是以与java中的类类似的方式使用它们。类描述了对象的一些常见属性。在这里，我看到一个按钮对象。没有颜色也没有高度对象： - ）

您可以查看示例twitter bootstrap框架。只需转到引导页面，在您喜欢的浏览器中打开DOM查看器，并分析类如何描述的特定“组件”。

哪种方法更好： - 在html标签中有2个类，或者在具有相同属性的2个类中有2个类

2 个答案: