1

我有一个问题，我需要根据它们的第一类（仅）设置我的元素的样式。我的标题是自动生成的，上面有许多标签（取决于类别），但是我想使用第一个类别标签来设置元素的样式。这是一个例子：

<div class="tag-text tag-design tag-architecture">TITLE HERE</div>

...和一个 CSS 代码位：

.tag-architecture {
  background-color: purple;
}
.tag-text {
  background-color: black;
}
.tag-design {
  background-color: green;
}

你可以猜到，如果 html 元素同时有 3 个标签，它的样式取决于 CSS 的最后一部分，在本例中为.tag-design.

是否可以仅在第一个类（在这种情况下）上设置元素的样式.tag-text- 以便在这种特定情况下背景保持黑色？

4

1 回答 1

6

您可以尝试使用 CSS3 子字符串匹配属性选择器

[class^="tag-architecture"] {
  background-color: purple;
}

[class^="tag-text"] {
  background-color: black;
}

[class^="tag-design"] {
  background-color: green;
}

CSS3 子串匹配属性选择器如下：

[att^=val] – the "begins with" selector
[att$=val] – the "ends with" selector
[att*=val] – the "contains" selector
于 2013-11-04T16:05:40.940 回答