問題描述

我有以下代碼:

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

但是，在最后一個(gè)元素上，我需要?jiǎng)h除該邊框，因?yàn)槲艺谑褂玫脑O(shè)計(jì)表明最后一項(xiàng)不需要邊框作為分隔符.

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.

所以，我需要定位列表的最后一個(gè)子元素，因此在我的 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 中運(yùn)行良好.

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

問題出在我們?cè)?Internet Explorer 6 到 8 中查看頁面時(shí).

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，請(qǐng)指定如下樣式表:

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 表達(dá)式查看其后是否有元素，是否繼承默認(rèn)樣式表中指定的規(guī)則，如果沒有則應(yīng)用新規(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.

更多信息可以在這里找到

這篇關(guān)于CSS 和 Internet Explorer 中的 :last-child 偽類選擇器的文章就介紹到這了，希望我們推薦的答案對(duì)大家有所幫助，也希望大家多多支持html5模板網(wǎng)！