HTML元素类声明中的空格是什么？ [复制]答案

【问题标题】：What is a space used for in an HTML-element class-declaration? [duplicate]HTML元素类声明中的空格是什么？ [复制]
【发布时间】：2012-12-23 17:37:10
【问题描述】：

可能重复：
HTML class attribute with spaces, it is a W3C valid class?

我正在使用现有的 HTML 源代码。考虑以下行：

<ul class="thumbs noscript">

thumbs 和 noscript 之间的空格是什么意思？

【问题讨论】：

标签： html css

【解决方案1】：

这意味着这里有两个类：thumbs 和 noscript。

【讨论】：

【解决方案2】：

HTML 元素正在使用已登记的两个类，用空格分隔。

【讨论】：

【解决方案3】：

这意味着这个元素有 2 个类。 thumbs 和 noscript 都有

这意味着你可以像这样使用 css 选择这个元素：

.thumbs { color:#f00; }
.noscript { color:#000; }

或

.thumbs.noscript { color:#fff; }

【讨论】：

第一个例子很糟糕。在这两个类中有不同的规则会更好。
我将其更改为包含不同的颜色 :)

【解决方案4】：

空间是为了让多个类分开。

【讨论】：

【解决方案5】：

一个元素可以有多个类，所以在这种情况下它有“thumbs”和“noscript”类。所以类名之间的空格只是将它们分开。

看名字很有可能有一些 CSS，例如总是显示带有“noscript”类的元素。使用 JavaScript 时，可能会在页面加载时删除此类，以使页面对启用 JavaScript 的任何人都更好。

【讨论】：

【解决方案6】：

一个空格用于在一个类声明中分隔多个类 - 所以它基本上意味着类 thumbs 和 noscript 都适用于 UL 元素。

要通过 CSS 选择必须同时具有这两个类的元素，您可以使用如下选择器：

.thumbs.noscript {
   /* Properties that apply to elements that have both classes. */
}

请注意，CSS 中的规则声明中的类之间没有空格。如果你在类之间放置一个空格，那么 noscript 必须是拇指的孩子才能应用规则。

当您想将 CSS 属性应用于具有两个类的元素而不是仅具有一个或不具有任何一个类的元素时，上述 CSS 规则非常有用。

【讨论】：

【解决方案7】：

这样您就可以使用多个类 - 因此您可能会在网站的不同区域重复使用一些类。

现实生活中的例子可能是：

.thumbs {width:150px; height:150px; background-colour:#fff;}
.noscript {clear:both;}

【讨论】：