Question

这很好用

.content-wrapper.row-fluid + .footer.row-fluid {
    margin-top: 40px;
}

这仅在正文分类为path-frontpage的页面上成功正确地定位了同级对象

.path-frontpage .footer.row-fluid {}

这适用于页面上页脚上方的div，正文分类为path-frontpage

.path-frontpage .content-wrapper.row-fluid {}

但是，对于主体分类为path-frontpage的页面，这不会将页脚页边距顶端设置为零。 Chrome检查器显示第一个规则已生效。为什么？或者更确切地说-如何仅在正文类为path-frontpage的页面上使页边距取反？

.path-frontpage .content-wrapper.row-fluid + .path-frontpage .footer.row-fluid {
    margin-top: 0px;
}

Answer 1

真实用法

.path-frontpage .content-wrapper.row-fluid + .footer.row-fluid {
    margin-top: 0px;
}

为了使代码正常工作，html应该是这样的。

div { border:1px solid #ff0000; height: 30px; }

.content-wrapper.row-fluid + .footer.row-fluid {
    margin-top: 40px;
}

.path-frontpage .content-wrapper.row-fluid + .path-frontpage .footer.row-fluid {
    margin-top: 0px;
}

<body class="path-frontpage">
<div class="content-wrapper row-fluid">wrapper
</div>
<div class="path-frontpage"> <!-- I added -->
<div class="footer row-fluid">footer
</div>
</div>
</body>

添加父元素类时，CSS相邻兄弟选择器失败

1 个答案: