带有空格的CSS html声明[重复]答案

【问题标题】：CSS html declarations with spaces [duplicate]带有空格的CSS html声明[重复]
【发布时间】：2013-10-17 12:13:59
【问题描述】：

如果有一个简单的谷歌搜索这个问题，我现在道歉，但我不确定我要使用哪些关键字。我对 CSS 很满意，但我认为我还没有充分利用这门语言的全部力量，也没有完全消除代码冗余。

我遇到过这段代码（任何类似的 sn-ps 很多次）：

<p class="comment smallertext center-align">

这指的是什么 CSS？在评论方面，smallertext 和 center-align 都是有间距的。

提前感谢您的任何回复和指导！

【问题讨论】：

标签： html css

【解决方案1】：

这意味着该元素具有以下所有类：comment、smallertext 和 center-align。在 HTML 中，空格将多个类名分隔在一个属性中。

在 CSS 中，您可以单独或一起使用 .comment、.smallertext 或 .center-align 中的一个或多个来定位此元素。拥有三个单独的规则和一个包含所有三个类的元素，所有三个规则都将适用：

.comment {}
.smallertext {}
.center-align {}

如有必要，您还可以将它们组合在一起，以应用特定于具有所有三个类的元素的样式：

.comment.smallertext.center-align {}

【讨论】：

【解决方案2】：

示例中显示的代码链接到 3 个不同的 css 类选择器：

.comment {
}

.smallertext {
}

.center-align {
}

因此，与其制作大量不可重用的 css 选择器，不如将它们分成许多小的选择器，这些选择器提供的功能很可能会用于您网站的许多不同部分。在该示例中，您有一个用于 cmets，一个用于较小的文本，一个用于居中对齐文本。

【讨论】：

【解决方案3】：

这是一种为单个元素定义多个类的方法。在这种情况下，它将匹配 comment、smallertext 和 center-align 类。

【讨论】：

【解决方案4】：

Try this short explanation... 多个类可以更轻松地为元素添加特殊效果，而无需为该元素创建全新的样式。

【讨论】：