html - 为什么这段 CSS 代码没有按预期工作？

Question

有人可以告诉我为什么下面的 CSS 代码不起作用吗？我完全不明白为什么，这不是我第一次参加牛仔竞技表演。

我已将以下代码添加到 CSS 文件的 END 以确保没有其他内容会覆盖它:

address,
span,
.gStyle {
    font-weight:bold;
    font-size:small;
    text-transform:capitalize;
}

.gStyle .ngs address {
    color: red;
    font-size: 10px;
}

.gStyle .sgs span {
    color: black;
    font-size: 12px;
}

并且我在代码中调用类如下:

<address class="ngs">lorem ipsum</address>
<span class="sgs">lorem ipsum</span>

但我期望发生的是

中的内容

• address 将返回为 BOLD+CAPITALIZED+RED+10PX 和内容，
• span 将以 BOLD+CAPITALIZED+BLACK+12PX 的形式返回，而任何直接调用，
• gStyle 将返回 BOLD+SMALL+CAPITALIZED。

这没有发生，那么我做错了什么？我编写代码的时间太长了，看不出哪里出了问题，但我也是一个足够大的人，可以说，嘿，你一定漏掉了什么，所以问吧。

编辑 - 澄清

实际上我需要的是，当我将 CLASS="ngs" 应用到任何元素时，但至少应用到 ADDRESS 时，它将应用两种样式gStyle 是基本样式，但也应用了 ngs 附加样式。我尝试使用 CLASS="gStyle ngs" 但这也不起作用。同样的逻辑适用于 sgs 所以你能告诉我我在做什么错吗？很抱歉，它不是更清楚，我认为要点预期结果与 HTML 片段一起就足够了。

Answer 1

.gStyle .ngs address 选择 .gStyle 元素内的 .ngs 元素内的 address 元素.

看起来您想要一个 address 元素，它是 .gStyle 元素中的一个 .ngs 元素，这将使您的代码:

.gStyle address.ngs

同样适用于跨度:

.gStyle span.sgs