Tom*_*m11 10 html css wordpress css-selectors
我正在完成我的wordpress网页,我想在帖子页面中设置(使用CSS)条目卷.Wordpress创建了这个:
<div class="entry">
Run Code Online (Sandbox Code Playgroud)
页面中有大量这些元素,为了将它们分开,我在条目的底部使用了边框.问题是,我不想在最后一个条目上使用此边框.可以像在CSS中那样完成吗?(注意它不是列表所以我不能使用伪类)
这是CSS,它非常简单:
.entry{ border-bottom: 1px solid yellow; }
Run Code Online (Sandbox Code Playgroud)
HTML:
<div id="wrapper">
<br />
there are loads of code
<br />
<div class="entry">bunch of code there</div>
<br />
<div class="entry">bunch of code there</div>
<br />
<div class="entry">bunch of code there</div>
<br />
another huge code
<br />
</div>
Run Code Online (Sandbox Code Playgroud)
在此先感谢您的帮助.
tuf*_*uff 13
您已经命名了您正在寻找的内容last-child:http://reference.sitepoint.com/css/pseudoclass-lastchild
所以使用 .entry:not(:last-child) { border-bottom: 1px solid yellow; }
请注意,它不是列表,所以我不能使用伪类)
JSYK,伪类不依赖于包含元素的列表.如果您的意思是最终.entry元素实际上不是其容器的最后一个子元素,则仍可以选择它.但除非你告诉我实际的标记是什么样的,否则我无法告诉你.
如果你的决赛div.entry没有跟随任何其他div,那么选择器.entry:not(:last-of-type)将适合你.
.entry:last-child {
border-bottom: none;
}
Run Code Online (Sandbox Code Playgroud)
比方说,你有一个列表<li>的链接<a>里面,你想获得这最后<a>的的<li>的.只需使用:
.entry:last-child a {
border-bottom: none;
}
Run Code Online (Sandbox Code Playgroud)
这将选择最后一个.entry并定位它的链接