有没有办法引用具有多个类的 html 元素？答案

【问题标题】：Is there a way to refer to an html element with multiple classes?有没有办法引用具有多个类的 html 元素？
【发布时间】：2025-12-04 01:50:02
【问题描述】：

我有以下

<p class="main yellow">Hello World</p>

我想编写一个仅引用具有 main 和 Yellow 的元素的 css 元素。有没有办法做到这一点？

例如。以下不起作用，但将是我所追求的

.main + .yellow { color:green }

【问题讨论】：

【解决方案1】：

这应该抓住它：

.main.yellow { color:yellow; }

虽然您可能会在不同的浏览器中得到不同的结果。我使用QuirksMode 来了解跨浏览器会/不会起作用的内容。

【讨论】：

【解决方案2】：

您只需将它们指定为

.main.yellow { color: green; }

两个类之间没有空格。

【讨论】：

【解决方案3】：

这对你有用吗？

.main.yellow{
  color:green;
}

【讨论】：

【解决方案4】：

正如其他人已经说过的，你想要的是：

.main.yellow { color:green; }

但是，让我快速解释一下为什么您的第一次尝试没有成功。 + 关键字指的是 following 元素，即后面的元素。

您的示例将匹配以下 HTML...

<p class="main">Hello</p>
<p class="yellow">World</p>

...并将第二段 (.yellow) 设置为绿色。所以“.main + .yellow”的意思是“选择一个紧跟在.main之后的.yellow”。

【讨论】：