CSS - 公共(public)类

Question

在我的网络应用程序中，我使用多个 CSS 类来编写更少的代码。在某些情况下，我经常在标记中使用它们来添加一个或两个属性。

下面是这些

.clear { float: none; clear: both; }
.fl_l{ float: left; }
.fl_r{ float: right; }
.ta_l{ text-align: left; }
.ta_r{ text-align: right; }
.no_td:hover { text-decoration: none; }

您使用哪些类似的类(class)？你在其他元素中见过这种技术吗？

Answer 1

很抱歉对这样一个老问题发表回答，但我认为这是个坏主意。也许对于一组特定的问题，它符合要求。我的想法是 CSS 应该是样式信息所在的位置。通过执行您的建议，您实际上只是在 html 中使用 style 属性，因此将内容与样式信息混合在一起。这是一个坏主意，因为如果有一天您决定完全更改样式，您将不得不进入并通过删除大部分类来更新 HTML。

例如，如果您有这样的 HTML(比如在页面中多次使用的摘要):

<p class="abstract ta_l mb10">
    Lorem ipsum dolor set.
</p>

有一天您决定更改该摘要的外观:例如，您不希望它不再是“文本对齐:左”并且没有边距底部(这大概是 mb10 的样子......我'之前已经看到它被使用过)，您将不得不进入并更改 HTML。

现在将其乘以您必须更改的 10 个元素。如果是50呢？如果您要进行彻底的重新设计怎么办？ 不寒而栗。

CSS 提供了一种方法，可以通过一个简单的查询来选择多个元素，并为它们提供可以从集中位置轻松更改的适当样式。通过使用这些“帮助程序”类，您正在使这个元素的维护成为下一个开发人员的噩梦。

相反，如果您有这样的 HTML:

<p class="abstract">
    You should sign in or something!
</p>

和像这样的 CSS:

.abstract {
   margin-bottom: 10px;
   text-align: left;
}

您可以将一条规则更改为:

.abstract {
  text-align: right;
  margin-bottom: 0;
}

完成它!对于所有 50 个元素!

只是我的 2 美分 -- 来自刚被此烧伤的人。