CSS 和 Internet Explorer 中的 :last-child 伪类选择器

:last-child pseudo class selector in CSS and Internet Explorer(CSS 和 Internet Explorer 中的 :last-child 伪类选择器)
本文介绍了CSS 和 Internet Explorer 中的 :last-child 伪类选择器的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着跟版网的小编来一起学习吧!

问题描述

我有以下代码:

ul.myList li{
     border-right: 1px dotted #000;
}

但是,在最后一个元素上,我需要删除该边框,因为我正在使用的设计表明最后一项不需要边框作为分隔符.

However, on the last element, I need to remove that border as the design that I am working from dictates that the last item does not require a border as a separator.

所以,我需要定位列表的最后一个子元素,因此在我的 CSS 中添加了

So, I need to target the last child of a list and so within my css I have added

ul.myList li:last-child{
     border-right: none;
}

众所周知,它在 Firefox、Safari 和 Chrome 中运行良好.

Which as we all know, works fine in Firefox, Safari and Chrome.

问题出在我们在 Internet Explorer 6 到 8 中查看页面时.

The problem lies when we view the page in Internet Explore 6 through to 8.

推荐答案

所以,经过一番挖掘,我找到了答案:

So, after some digging around, I found the answer:

如果浏览器是 IE<8,请指定如下样式表:

If the browser is IE<8, specify a stylesheet like this:

<!--[if lt IE 8]>
<link rel="stylesheet" href="css/ie_all.css" type="text/css" />
<![endif]-->

并在您的 IE 样式表中指定以下规则:

And within your IE stylesheet specify the following rules:

ul.myList li{
     border-right: expression(this.nextSibling==null?'none':'inherit');
}

nextSibling 表达式查看其后是否有元素,是否继承默认样式表中指定的规则,如果没有则应用新规则.

The nextSibling expression looks to see if there is an element after it and if there is inherits the rule specified in the default stylesheet, if not it applys a new rule.

更多信息可以在这里找到

这篇关于CSS 和 Internet Explorer 中的 :last-child 伪类选择器的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!

本站部分内容来源互联网,如果有图片或者内容侵犯了您的权益,请联系我们,我们会在确认后第一时间进行删除!

相关文档推荐

Scale background image to fit ie8 window(缩放背景图像以适合 ie8 窗口)
@fontface in IE7 (IETEster) not working properly(IE7 (IETEster) 中的@fontface 无法正常工作)
Safari 5.1 breaks CSS table cell spacing(Safari 5.1 打破 CSS 表格单元格间距)
How to delegate `hover()` function by using `on()`(如何使用 `on()` 委托 `hover()` 函数)
How to center slider in css?(如何在css中居中滑块?)
Show slider range value on top of thumb(在拇指顶部显示滑块范围值)