[英]CSS Working Different in Chrome and IE 8
我有這個CSS類在Chrome中運行良好,但在IE 8中(是的,我的工作仍然使用IE 8),背景圖像沒有顯示出來。 我認為IE 8可能不知道如何處理CSS的某些部分,但無法確定它。
這是CSS類
ul.action:not(.btnImage) li a:not(.btnImage), ul.groupAction:not(.btnImage) li a:not(.btnImage), ul.actionGradient:not(.btnImage) li a:not(.btnImage){
background-color: transparent !important;
background: url("../images/buttons/btnShineBackground.png") top left repeat-x !important;
border-width: 0px 1px !important;
border-color: #f47a2a !important;
border-style: ridge !important;
padding: 0px !important;
color: #FFF !important;
width: 120px !important;
height: 29px !important;
text-align: center !important;
vertical-align: middle !important;
line-height: 29px !important;
font-size: 10px !important;
font-weight: lighter !important;
font-family: Arial Black !important;
font-style: normal !important;
text-transform: uppercase !important;
這是HTML
<ul class=" action"><li><a href="javascript:void(0);" onmousemove="window.status='';" onmouseout="window.status='';" id="r898BB6A34E694110894F489DA4BEA3BB1DE_3" onfocus="storeFocusField(this);" onclick="customOnClick(this);submitAjax(this,'PageContainer','a_r898BB6A34E694110894F489DA4BEA3BB1DE_3','0','','','','N','',null,'');">Continue</a></li></ul>
非常簡單:您在IE8中不支持的選擇器中使用CSS功能。
IE8不支持CSS :not()
。 因此,您的選擇器將無法工作。 因此,沒有看到該選擇器內的CSS。
你的選擇是:
重寫您的CSS,以便您只使用您想要支持的瀏覽器中提供的功能。
繼續使用這些功能,並停止支持IE8。
使用像Selectivizr這樣的polyfill腳本來幫助IE8理解那些CSS選擇器。
IE8不支持那些CSS選擇器。 但是你要克服困難。
使用多個選擇器會更簡單,您不需要使用不受支持的偽類
UL.action{
background: url("../images/buttons/btnShineBackground.png") top left repeat-x;
}
UL.action.btnImage{
background: none:
}
IE8不支持Pseudo類: https : //developer.mozilla.org/en-US/docs/Web/CSS/ :not
IE8不支持CSS3選擇器(例如:not
)
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.