条件IE8风格在原始CSS文件? [英] Conditional IE8 style in original CSS file?
问题描述
如何覆盖这种样式只为IE8浏览器(我不认为我太关心IE7用户,除非如果标记是非常小的)?
#menu ul {
margin:0;
padding:0;
width:650px;
}
#menu ul li {
display:inline-block;
width:110px;
padding:15px 10px 15px 10px;
text-align:center;
color:#000;
text-decoration:none;
font-weight:bold;
background:#e5e5c3;
}
显然,IE8及以下版本不会在li元素上显示inline-block那么如何在这个原始的CSS文件中有条件地覆盖这个呢?
你可以使用一个条件html标签来添加一个类如果浏览器如果IE和目标通过特定性,加载一个ie8只有样式表或使用CSS黑客 \0 /
仅目标IE8。
如果您在IE中只有一对一的问题,我建议您选择头部路线。
HTML类方法
HEAD
<! - [if IE 8]> < html class =no-js ie8 oldielang =en> <![endif] - >
<! - [if gt IE 8]><! - > < html class =no-jslang =en> <! - <![endif] - >
在您的CSS中
.ie8 #menu ul li {
display:block;
width:110px;
padding:15px 10px 15px 10px;
text-align:center;
color:#000;
text-decoration:none;
font-weight:bold;
background:#e5e5c3;
}
仅限IE8样式表方法
<! - [if IE 8 ]>< link href =/ css / app-ie8.csstype =text / stylesheet/> <![endif] - >
IE8 CSS hack
在选择器后使用\0 /
#nav li ul {
left:-39px \\ \\ 0 /!important;
}
How can I override this styling for just IE8 browsers (I don't think I care too much for IE7 users anymore unless if the markup is very minimal)?
#menu ul {
margin:0;
padding:0;
width:650px;
}
#menu ul li {
display:inline-block;
width:110px;
padding:15px 10px 15px 10px;
text-align:center;
color:#000;
text-decoration:none;
font-weight:bold;
background:#e5e5c3;
}
Obviously, IE8 and below doesn't render display inline-block on li elements so how can I conditionally override this in this original CSS file?
You can either use a conditional html tag to add a class if the browser if IE and target via specificity, load an ie8 only stylesheet or use a CSS hack \0/
to target IE8 only.
I suggest the head route if you only have a couple one-off issues in IE.
HTML Class Method
In your HEAD
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
In your CSS
.ie8 #menu ul li {
display:block;
width:110px;
padding:15px 10px 15px 10px;
text-align:center;
color:#000;
text-decoration:none;
font-weight:bold;
background:#e5e5c3;
}
IE8 only stylesheet method
Load AFTER your common shared styles.
<!--[if IE 8]><link href="/css/app-ie8.css" type="text/stylesheet"/> <![endif]-->
IE8 CSS hack
use \0/ directly after selector
#nav li ul {
left: -39px\0/ !important;
}
这篇关于条件IE8风格在原始CSS文件?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!