如果<section>后面跟着另一个<section>?</section> </section>,我如何设置样式

时间:2012-09-28 09:00:19

标签: css css3 css-selectors

我正在使用部分来确定页面的不同部分。这些部分的底部边距为90px但是当在页面中创建/放置ID为“clients-full”的部分时,我希望它之前/之上出现的任何部分的底部边距为0.我可以做这使用CSS选择器/伪选择器?

目前,这段代码为ID为'clients-full'的部分设置样式,但它是否可以反转,所以我可以在它之前的部分应用下边距0?

 section + section#clients-full {
    margin-top: -90px; // Negative margin to get around this problem...not ideal.
 }

1 个答案:

答案 0 :(得分:1)

在当前定义为已实现的CSS中,选择器不能以选择元素的方式使用,具体取决于后面的内容,仅取决于之前的内容。好吧,选择器linke :nth-last-child(...)在某种意义上是个例外,但在这种情况下它们没有帮助。

因此,更好的方法是通过在它们上设置顶部边距来分隔这些部分,如果需要,将第一部分作为特殊情况处理(没有上边距),也许是最后一部分部分,使用:last-ot-type(如果需要,在其上设置下边距)。然后,只需使用#clients-full { margin-top: 0; }

即可轻松处理所描述的案例