根据浏览器不同加载不同的css实现兼容
作者:佳明妈 来源:web前端开发 2016-09-10 人气:浏览器有IE阵营、火狐阵营、谷歌阵营、苹果Safari阵营,特别是IE系列,更是有各种版本兼容问题,要根据浏览器不同加载不同的css实现兼容有很多方式,ie的条件注释实现不同浏览器加
浏览器有IE阵营、火狐阵营、谷歌阵营、苹果Safari阵营,特别是IE系列,更是有各种版本兼容问题,由于其他浏览器都能轻易升级到新版,而只有IE升级麻烦,高版本的IE甚至需要高版本系统的支持,低版本的系统根本装不了高版本的ie浏览器。
实际工作中浏览器的兼容性主要在于ie浏览器各种版本之间的兼容问题。
要根据浏览器不同加载不同的css实现兼容有很多方式,ie的条件注释实现不同浏览器加载不同css样式的方法
<!--[if IE]> 所有的IE可识别 <![endif]-->
<!--[if IE 6]> 仅IE6可识别 <![endif]-->
<!--[if lt IE 6]> IE6以及IE6以下版本可识别 <![endif]-->
<!--[if gte IE 6]> IE6以及IE6以上版本可识别 <![endif]-->
<!--[if IE 7]> 仅IE7可识别 <![endif]-->
<!--[if lt IE 7]> IE7以及IE7以下版本可识别 <![endif]-->
<!--[if gte IE 7]> IE7以及IE7以上版本可识别 <![endif]-->
<!--[if IE 8]> 仅IE8可识别 <![endif]-->
<!--[if lt IE 8]> IE8以及IE8以下版本可识别 <![endif]-->
<!--[if gte IE 8]> IE8以及IE8以上版本可识别 <![endif]-->
实际工作中浏览器的兼容性主要在于ie浏览器各种版本之间的兼容问题。
要根据浏览器不同加载不同的css实现兼容有很多方式,ie的条件注释实现不同浏览器加载不同css样式的方法
使用ie的条件注释区分不同浏览器
<!--[if lte IE 6 ]> <html class="ie ie6 lte_ie7 lte_ie8 lte_ie9" lang="zh-CN"> <![endif]-->
<!--[if IE 7 ]> <html class="ie ie7 lte_ie7 lte_ie8 lte_ie9" lang="zh-CN"> <![endif]-->
<!--[if IE 8 ]> <html class="ie ie8 lte_ie8 lte_ie9" lang="zh-CN"> <![endif]-->
<!--[if IE 9 ]> <html class="ie ie9 lte_ie9" lang="zh-CN"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="zh-CN"> <!--<![endif]-->
这里使用了条件注释判断不同的浏览器就在html这个根元素上添加上不同的类名
当然,也可以使用引入外部样式表的方式实现
<!--[if IE 9 ]>
作为条件注释,其实条件注释之间是可以写任意html代码的
<!--[if IE 9 ]> 当然,也可以使用引入外部样式表的方式实现
<!--[if IE 9 ]>
<link rel="stylesheet" type="text/css" href="css.css">
<![endif]-->作为条件注释,其实条件注释之间是可以写任意html代码的
html代码
<![endif]-->ie条件注释的一些注解
<!--[if !IE]>除IE外都可识别<![endif]--><!--[if IE]> 所有的IE可识别 <![endif]-->
<!--[if IE 6]> 仅IE6可识别 <![endif]-->
<!--[if lt IE 6]> IE6以及IE6以下版本可识别 <![endif]-->
<!--[if gte IE 6]> IE6以及IE6以上版本可识别 <![endif]-->
<!--[if IE 7]> 仅IE7可识别 <![endif]-->
<!--[if lt IE 7]> IE7以及IE7以下版本可识别 <![endif]-->
<!--[if gte IE 7]> IE7以及IE7以上版本可识别 <![endif]-->
<!--[if IE 8]> 仅IE8可识别 <![endif]-->
<!--[if lt IE 8]> IE8以及IE8以下版本可识别 <![endif]-->
<!--[if gte IE 8]> IE8以及IE8以上版本可识别 <![endif]-->
↓ 查看全文
根据浏览器不同加载不同的css实现兼容由懒人建站收集整理,您可以自由传播,请主动带上本文链接
懒人建站就是免费分享,觉得有用就多来支持一下,没有能帮到您,懒人也只能表示遗憾,希望有一天能帮到您。
根据浏览器不同加载不同的css实现兼容-最新评论