css - 在IE678下用什么方法解决伪类last-child?
天蓬老师
天蓬老师 2017-04-17 11:07:27
0
13
1271

我知道可以通过给最后一个添加class,但是这个是所有浏览器下都添加class,那last-child不用都可以了。


这问题应该放在新手下面的,但习惯性直接在首页撰写,所以...


开始我是有找下解决的方法。
一般last-child都是用在菜单或者列表用边框分隔的时候,把最后面一个border的设定去掉。

一种方法是给最后一项添加一个class,例如.last-child,把border设为none值。(这个不便于数据绑定,不然又得判断最后一个,麻烦)。

一种方法是通过js把最后最后一项的边框值去掉,达到last-child的目的:

if ($('html').hasClass('lt-ie9')) {
    $('[data-fix-last-child]').each(function () {
        var $me = $(this);
        var element = $me.data('fix-last-child');
        $me.find(element).last().css({ 'border': 'none','background': 'none' });
    });
}

但是上面两种方法都是所有浏览器下都生效,也就是不用last-child都可以了。当然也可以判断是IE678的时候才使用上面的方法,但没什么必要。

还有一种方法是使用:

expression(this.nextSibling==null?'0':'1px');

没试过,因为不支持IE8。

天蓬老师
天蓬老师

欢迎选择我的课程,让我们一起见证您的进步~~

reply all(13)
洪涛

first-child完全可以解决好所遇到的大部分场景

迷茫
  • 使用CSS3但也别忘了基本的知识 负边距margin
Ty80

可以不用到last-child,改用first-child 因为IE8不支持last-child但是支持first-child(奇葩啊),
把border-bottom改为border-top然后再用first-child即可,http://caniuse.com/ 这个网站可以查到你使用类的支持性,

Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!