之後使用：以及之前：Internet Explorer版本6和7中的選擇器

Question

我使用的是this blog 中提到的嚮導的不錯風格，但不幸的是它在IE中無法正常工作，因爲正如博客中提到的：

對於不支持的瀏覽器：在/之前/ nth-child之後，代碼將不起作用。

所以有什麼辦法可以解決這個問題，使IE瀏覽器能夠很好地工作。

僅供參考，CSS是：

#wizHeader li .prevStep 
{ 
    background-color: #669966; 
} 
#wizHeader li .prevStep:after 
{ 
    border-left-color:#669966 !important; 
} 
#wizHeader li .currentStep 
{ 
    background-color: #C36615; 
} 
#wizHeader li .currentStep:after 
{ 
    border-left-color: #C36615 !important; 
} 
#wizHeader li .nextStep 
{ 
    background-color:#C2C2C2; 
} 
#wizHeader li .nextStep:after 
{ 
    border-left-color:#C2C2C2 !important; 
} 
#wizHeader 
{ 
    list-style: none; 
    overflow: hidden; 
    font: 18px Helvetica, Arial, Sans-Serif; 
    margin: 0px; 
    padding: 0px; 
} 
#wizHeader li 
{ 
    float: left; 
} 
#wizHeader li a 
{ 
    color: white; 
    text-decoration: none; 
    padding: 10px 0 10px 55px; 
    background: brown; /* fallback color */ 
    background: hsla(34,85%,35%,1); 
    position: relative; 
    display: block; 
    float: left; 
} 
#wizHeader li a:after 
{ 
    content: " "; 
    display: block; 
    width: 0; 
    height: 0; 
    border-top: 50px solid transparent; /* Go big on the size, and let overflow hide */ 
    border-bottom: 50px solid transparent; 
    border-left: 30px solid hsla(34,85%,35%,1); 
    position: absolute; 
    top: 50%; 
    margin-top: -50px; 
    left: 100%; 
    z-index: 2; 
} 
#wizHeader li a:before 
{ 
    content: " "; 
    display: block; 
    width: 0; 
    height: 0; 
    border-top: 50px solid transparent; 
    border-bottom: 50px solid transparent; 
    border-left: 30px solid white; 
    position: absolute; 
    top: 50%; 
    margin-top: -50px; 
    margin-left: 1px; 
    left: 100%; 
    z-index: 1; 
} 
#wizHeader li:first-child a 
{ 
    padding-left: 10px; 
} 
#wizHeader li:last-child 
{ 
    padding-right: 50px; 
} 
#wizHeader li a:hover 
{ 
    background: #FE9400; 
} 
#wizHeader li a:hover:after 
{ 
    border-left-color: #FE9400 !important; 
} 
.content 
{ 
    height:150px; 
    padding-top:75px; 
    text-align:center; 
    background-color:#F9F9F9; 
    font-size:48px; 
} 

Answer 1

的前後CSS元素應該在IE8的工作和最多。

對於IE7，您可以使用類似於IE7.js黑客在之後添加僞元素支持。

我會建議使用條件語句來包含文件，如;

<!--[if IE 7]> 
    insert script here 
<![endif]--> 

對於IE6，我個人不會打擾，只是優雅地退化。

另一種選擇是to use ie-css3.js。