css怎么判断浏览器的类型?

css判断浏览器的方法

作为一个web开发员,特别是前台设计师在做WEB开发的时候经常会遇到一些浏览器不兼容的情况,这也是许多开发者头痛的问题,因为这不是开发者技术的问题,而是浏览器不统一而导致。这里总结了一些通过css代码来判断浏览器的类型,从而针对不同的浏览器写出不同的css代码来解决浏览器兼容的问题,希望对大家有所帮助:

(推荐学习:CSS视频教程

一、通过CSS代码直接判断(就是在css代码里面进行判断)

<style type="text/css">   
    .top{color:red ;}/*firefox*/    
    * html #example{color:blue;}/*ie6*/    
    *+ html #example{color:green;}/*ie7*/    
</style>   
</head>   
<body>   
    <div class="top">在FireFox下显示为红色,在IE6.0下显示为蓝色,在IE7.0下显示为绿色。</div>   
</body>

二、通过CSS条件注释的方法判断(条件注释就是用if语句来判断浏览器的型号)

<style> 
    .top{color:#ff6600}/*--火狐显示为橙色*/ 
</style> 
<!--[if IE 6]> 
<style> 
    .top{color:#0000ff}/*--IE6显示为蓝色*/ 
</style> 
<![endif]--> 
<!--[if IE 7]>  
<style> 
    .top{color:#ff0000}/*--IE7显示为红色*/ 
</style> 
<![endif]--> 
<!--[if IE 8]>  
<style> 
    .top{color:#6633cc}/*--IE8显示为紫色*/ 
</style> 
<![endif]--> 
<body>  
    <div class="top">在FireFox下显示为橙色,在IE6.0下显示为蓝色,在IE7.0下显示为红色,IE8显示为紫色</div>  
</body>

三、针对IE浏览器,条件注释语句还有一些减少逻辑判断的参数:

lte:Less than or equal to的简写(就是小于或等于的意思)。
lt :Less than的简写(就是小于的意思)。
gte:Greater than or equal to的简写(就是大于或等于的意思)。
gt :Greater than的简写(也就是大于的意思)。

例如:

<!--[if gt IE 5.5]> / 如果IE版本大于5.5 /
<!–[if lte IE 6]> / 如果IE版本小于等于6 /
<!–[if !IE]> / 如果浏览器不是IE /

更多CSS相关技术文章,请访问CSS3答疑栏目进行学习!

以上就是css怎么判断浏览器的类型?的详细内容,更多请关注html中文网其它相关文章!

赞(0) 打赏
未经允许不得转载:html中文网首页 » CSS3 答疑

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端开发相关广告投放 更专业 更精准

联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏