文章/答案/技术大牛

发布

社区首页 >问答首页 >当父div有多个类时以嵌套div为目标

问当父div有多个类时以嵌套div为目标
EN

Stack Overflow用户

提问于 2013-11-07 05:00:43

回答 3查看 1.4K关注 0票数 1

我正试图在下面的示例中针对block类。问题是，根据父block是alignleft类还是alignright类，我需要以不同的方式对待每个div。我尝试过的任何东西都不会被捡起来( Mac上的Chrome)。不幸的是，我无法更改标记。

<div class="section alignleft">
    <div class="block"></div>
</div>

<div class="section alignright">
    <div class="block"></div>
</div>

目前，我正在使用以下不工作的CSS：

.section .alignleft .block { float: left; ... }
.section .alignright .block { float: right; ... }

但是，下面的可以执行工作，但对我来说并不有用，因为我需要确保block也在div中，并带有section类。

.alignleft .block { float: left; ... }
.alignright .block { float: right; ... }

P.S.做了很多次搜索，但没有想出任何答案来回答这个问题。我也不是很好的CSS，所以任何帮助都会非常感谢。

发布于 2013-11-07 05:03:47

去掉类之间的空间

.section.alignleft .block {
   /* Styles */
}

.section.alignright .block {
   /* Styles goes here */
}

在这里，我选择具有.block的元素，它嵌套在元素下面，第一个选择器中有类.section.alignleft，第二个选择器中有.section.alignright类。

使用.section .alignleft .block的选择器将选择具有.block的元素，该元素嵌套在具有.alignleft的元素中，该元素在具有.section的元素中进一步嵌套。

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/19828321

复制

相似问题

问当父div有多个类时以嵌套div为目标EN