[英]css last ul styling
I would like to add different styling to my last ul element with the class name footer_list
, but none of the following things are working 我想在类名称为
footer_list
最后一个ul元素中添加其他样式,但以下任何一项footer_list
ul.footer_list:last-child {
border-right: none;
}
#menu-bottom.pads ul.footer_list:last-child {
border-right: none;
}
the structure looks as it follows 结构如下
<div class="pads clearfix" id="menu-bottom">
<ul class="footer_list">
<li><a title="" href=""></a></li>
</ul>
<ul class="footer_list">
<li><a title="Zu den Dell Gutschein Codes" href="/dell-gutschein-codes/"></a></li>
</ul>
<ul class="footer_list">
<div class="menu-footer-container">
<ul class="menu" id="menu-footer">
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-25" id="menu-item-25"><a href=""></a></li>
</ul>
</div>
</ul>
</div>
You could also use the last-of-type pseudo selector. 您还可以使用最后一个类型的伪选择器。
.footer_list:last-of-type {
border-right: none;
}
You're using the wrong selector. 您使用了错误的选择器。 Rather than:
而不是:
ul.footer_list:last-child {
border-right: none;
}
It should be: 它应该是:
.footer_list:last-child {
border-right: none;
}
For an example to see the selector working correctly: http://jsfiddle.net/kDhS8/ 有关查看选择器正常工作的示例: http : //jsfiddle.net/kDhS8/
This works ! 这有效! ( http://jsfiddle.net/NJcVE/1/ )
( http://jsfiddle.net/NJcVE/1/ )
.footer_list:last-child { border-right: none;
.footer_list:last-child {border-right:none; }
}
and for IE7/8 you can add a class to last ul you want. 对于IE7 / 8,您可以在最后一个ul中添加一个类。 Example: CSS:
示例:CSS:
.lt-ie9 .last-child {border-right: none;}
Jquery: jQuery的:
/* LAST CHILD HACK FOR IE7/8 */
$(function(){
if( $.browser.msie ){
if( $.browser.version == 7.0 || $.browser.version == 8.0 ){
$('.footer_list').each(function(){
if( $(this).is(':last-child') ){
$(this).addClass('last-child');
}
});
}
});
When you're using last-child
, it means in your ul
all of the li
s are children, so you have to unify your ul
and the last li
is your last-child
, something like this: 当您使用
last-child
,这意味着您的ul
所有li
都是孩子,因此您必须统一ul
,而last li
是您的last-child
,如下所示:
CSS: CSS:
.footer_list li{
border: 1px solid #000;
}
.footer_list li:last-child {
border: none;
}
HTML: HTML:
<ul class="footer_list">
<li>Menu 1</li>
<li>Menu 2</li>
<li>Menu 3</li>
</ul>
you can use This 你可以用这个
#menu-bottom ul:last-child {
//css for Last ul tag
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.