CSS 规则在没有类的情况下应用，为什么？
P粉795311321
2023-09-04 13:26:05
<p>我定义CSS规则：</p>
<pre class="brush:php;toolbar:false;">.info-specs h2, h3, h4, h5 {
font-size: 1.5em;
text-transform: none;
}</pre>
<p>这应该只适用于类为“info-specs”的元素中的 h5。然而，经过检查，我发现其他h5元素也在使用这个规则。为什么？
下面是一个示例：</p>
<p>
<pre class="snippet-code-css lang-css prettyprint-override"><code>.info-specs h2, h3, h4, h5 {
font-size:5em;
text-transform: none;
}</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code><h5>mytest </h5></code></pre>
</p>
浏览器的 CSS 解释器将查找任何
h3、h4和h5元素，并且仅查找h2 它将查看它是否在.info-specs内。逗号或分组选择器将逗号分隔的所有内容视为单独的选择。您的问题的可能解决方案是：
/* These select for any h2, h3, h4 and h5 within .info-specs */ .info-specs h2, .info-specs h3, .info-specs h4, .info-specs h5 { text-decoration: underline; } /* These select for ant h2, h3, h4 and h5 that are direct chldren of .info-specs */ .info-specs > h2, .info-specs > h3, .info-specs > h4, .info-specs > h5 { color: red; }