問題描述
我有以下代碼:
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.
推薦答案
所以,經(jīng)過一番挖掘,我找到了答案:
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 樣式表中指定以下規(guī)則:
And within your IE stylesheet specify the following rules:
ul.myList li{
border-right: expression(this.nextSibling==null?'none':'inherit');
}
nextSibling
表達式查看其后是否有元素,是否繼承默認樣式表中指定的規(guī)則,如果沒有則應用新規(guī)則.
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 偽類選擇器的文章就介紹到這了,希望我們推薦的答案對大家有所幫助,也希望大家多多支持html5模板網(wǎng)!