css - 单行类

Question

一位同事刚刚将其添加到我们的元素中。

<ol class="numbered-list list-inside" start="1">

.numbered-list
{
    list-style-type: decimal;
}
.list-inside
{
    list-style-position: inside;
}

我是不是遗漏了什么，或者这和内联 CSS 一样糟糕？我该如何向我的同事解释这一点？

编辑 也许我的问题被误解了。不应该是这样的吗？

<ol class="info-list" start="1">

.info-list
{
    list-style-type: decimal;
    list-style-position: inside;
}

我想说的是，类名只代表它们应用的规则。因此，如果您想更改列表的表示形式，则必须更改 HTML(或更改 CSS，这样您最终会得到一个与其包含的规则相反的类名)。

另一个编辑也许这会进一步帮助您理解我的问题。

<p class="red">Hello</p>

.red
{
    color: red;
}

现在，您想将文本更改为绿色。看到问题了吗？

Answer 1

如果这些类在元素的其余部分单独使用，这没问题。如果不需要分离这些样式，那么这样的解决方案可能是不必要的。很多时候，如果它们用于不同的目的，您会向一个元素添加多个类。