html - CSS 中的多个点/句点

Question

你们中的一位 CSS 专家可以向我解释一下这个指示符(如果您愿意这样调用它的话)吗？我了解内容，只是不了解 a.button.gold。两个点？

a.button.gold{
background-color: #b9972f;
}

我正在尝试修改 Wordpress 主题上的几个样式，如果我能弄清楚当前发生了什么，我会取得更大的成功。谢谢

Answer 1

选择器只是意味着选择任何具有类 .button 以及 .gold 的 a 元素，因此您的 anchor 标记应如下所示

<a href="#" class="button gold">Hello</a>

Demo

选择器也可以写成element[attr~=val]如@BoltClock注解一样

a[class~="button"][class~="gold"] {
   color: #f00;
}

Demo

---

通常上面的(不是选择器，而是为单个元素方法调用多个类)也用于当你想将 2 个类的属性应用于单个元素时，例如你有 .demo 有 color: green; 和 .demo2 有 font-weight: bold; 所以使用

<p class="demo demo2">Hello, this will be green as well as bold</p>

将使它变得绿色和粗体。 Demo 2