具有多个值的html类属性（空格分隔）

我在一个项目中发现

<div class="gadget_title gradient37 vertsortable_head">
  ...
</div>

...

我知道我可以将一个元素与一个类（单个）相关联（例如，

），但是如何将多个值关联起来（这是什么意思）

---

如何使用css选择器选择它？

您可以为一个HTML元素分配多个类，这些类将被组合

您不需要将所有类都放在CSS选择器中，但是如果您想确保元素包含所有三个类，那么您必须

可以像这样选择此元素

.gadget_title
{
    ...
}

OR

.gradient37
{
    ...
}

OR

.gadget_title.gradient37
{
    ...
}

OR

.gradient37.vertsortable_head
{
    ...
}

OR

.gadget_title.vertsortable_head
{
    ...
}

OR

.gadget_title.gradient37.vertsortable_head
{
    ...
}

---

这确实意味着元素设置了多个

类

，这是绝对正常和有效的。这有助于重复使用样式。您不必将所有样式都放在每个类中。可以重复使用所需的任何样式。它们可以像单个类一样进行选择。

CSS

选择器将是：

div.gadget\u title.gradient37.veRoStReTabLeYeLoad <代码> >注意它们之间没有空格，因此它不会被认为是一个层次结构，而是一个组。你可以把你喜欢的元素和你的元素联系起来。ID的另一方面是独一无二的。例如，三个类->哺乳动物，猫和狗。给定这些类，你可以逻辑地构建两个元素：<代码> <代码>和< c。ode>

where.哺乳动物{腿：4；尾巴：1；}.猫{洁净度：9001；}.狗{洁净度：-3；}因此，多个类通过相似的特性/特征组合某些元素非常有用。