CSS:我可以使用嵌套元素的类来缩小 css 范围吗？

Question

这是我的例子:

<div class="node node-blog">
  <div class="field-item even">
    <img src="image.png"/>
  </div>
</div>

我想做的是仅当在 node-blog 和 field-item div 中时将样式应用于 img 元素，但这不起作用:

.node-blog .field-item img {float:right;}

当然我做错了什么。

谢谢。

Answer 1

提供的样式很好

除非您的 CSS 文件中有其他错误，否则这一行似乎是正确的。这很可能是非常愚蠢的事情。如果您实际上没有在此处复制粘贴代码，则可能在您的实际代码中存在一些拼写错误...

只要您的 img 包含在 .field-item 的子树中，该子树位于 .node-blog 的子树中应该管用。您不必提供完整路径。

其他规则覆盖你的

除非您在 img 上有不同的规则将其设置为 float。它的CSS样式

• 必须更具体到所提供的内容才能覆盖您的内容。
• 不太具体，但将 float 设置设置为 !important。