本文介绍了使用last-child选择器的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我的目标是将CSS应用到最后的 li ,但它不会这样做。



  #refundReasonMenu #nav li:last-child {border-bottom:1px solid#b5b5b5;}  pre> 

 < div id =refundReasonMenu> < ul id =nav> < li>< a id =abchref =#> abcde< / a>< / li> < li>< a id =defhref =#> xyz< / a>< / li> < / ul> < / div>  



如何选择 最后一个孩子?

解决方案

:last-child pseudoclass仍然不能跨浏览器可靠地使用。特别地, 9和Safari 3.2绝对,虽然Internet Explorer 7和Safari 3.2 支持:第一个孩子,好奇。



向该项显式添加 last-child (或类似)类,然后应用 li.last-child


My goal is to apply the CSS on the last li, but it doesn't do that.

#refundReasonMenu #nav li:last-child {
    border-bottom: 1px solid #b5b5b5;
}
<div id="refundReasonMenu">
    	<ul id="nav">
    		<li><a id="abc" href="#">abcde</a></li>
    		<li><a id="def" href="#">xyz</a></li>
    	</ul>
    </div>

How can I select only the last child?

解决方案

The :last-child pseudoclass still cannot be reliably used across browsers. In particular, Internet Explorer versions < 9, and Safari < 3.2 definitely don't support it, although Internet Explorer 7 and Safari 3.2 do support :first-child, curiously.

Your best bet is to explicitly add a last-child (or similar) class to that item, and apply li.last-child instead.

这篇关于使用last-child选择器的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

07-31 06:23