收藏本站腾讯微博新浪微博

经典论坛

 找回密码
 注册

QQ登录

只需一步,快速开始

蓝色理想 最新研发动态 网站开通淘帖功能 - 蓝色理想插件 论坛内容导读一页看论坛 - 给官方提建议

论坛活动及任务 地图和邮件任务 请多用悬赏提问 热夏来袭,选一款蓝色理想的个性T恤吧!

手机上论坛,使用APP获得更好体验 急需前端攻城狮,获得内部推荐机会 论坛开通淘帖功能,收藏终于可以分类了!

搜索
查看: 2386|回复: 4

[CSS] 前端代码兼容IE6、7、8、9、10、11的方法

[复制链接]
发表于 2018-1-25 09:45:15 | 显示全部楼层 |阅读模式
最近写了一个网页,在做IE兼容性问题时发现问题

<!--[if lt IE 9]>---<![endif]-->发现对IE6\7\8起作用,对IE9不起作用,于是重新又写了一个<!--[if gte IE 9]>---<![endif]-->。

<!--[if gte IE 9]>---<![endif]-->发现对于高于IE9的IE10和IE11均不起作用,经查IE10以上不支持条件注释了,解决方案是:

@media screen and(-ms-high-contrast:active),(-ms-high-contrast:none){

将IE10和IE11的CSS样式写在这里,覆盖掉原来的样式

}

在写兼容性代码时发现IE6\7\8不支持@media,所以在IE6\7\8里边固定了网页的显示尺寸,只对IE9使用@media,当然,高版本浏览器不受影响。

相关代码如下:   
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <!--[if lt IE 9]>
    <script src="{JS_PATH}/ltIE9.js"></script>
    <![endif]-->
    <link href="{CSS_PATH}/style.css" rel="stylesheet" type="text/css">
    <link href="{CSS_PATH}/index.css" rel="stylesheet" type="text/css">
    <!--[if lt IE 9]>
    <link href="{CSS_PATH}/lteIE8.css" rel="stylesheet" type="text/css">
    <![endif]-->
    <!--[if IE 9]>
    <link href="{CSS_PATH}/IE9.css" rel="stylesheet" type="text/css">
    <![endif]-->

不知道有没有更好的解决方法
发表于 2018-2-3 18:19:36 | 显示全部楼层
这种写法太丑了,而且有很多冗余代码,最好的办法是解析出ua,然后根据不同的ua发送不同的css文件
回复 支持 反对

使用道具 举报

 楼主| 发表于 2018-2-6 15:15:59 | 显示全部楼层
本帖最后由 bluedreamz 于 2018-2-6 15:20 编辑
yakczh 发表于 2018-2-3 18:19
这种写法太丑了,而且有很多冗余代码,最好的办法是解析出ua,然后根据不同的ua发送不同的css文件


怎么解析出ua?解析出来要做几个css样式?完全听不明白
回复 支持 反对

使用道具 举报

发表于 2018-2-24 17:22:39 | 显示全部楼层
额,直接在一个CSS里做判断不就好了,我现在做www.uuusj.com就准备这么干,因为现在响应式的写法已经很常规了,同时我觉得要100%去向下兼容的时代已经过去了。东西只会越做越好,不看呢个一直向后看啊。一般IE7基本兼容,IE8以上完全兼容就OK了!
回复 支持 反对

使用道具 举报

 楼主| 发表于 2018-3-5 11:14:10 | 显示全部楼层
ssay 发表于 2018-2-24 17:22
额,直接在一个CSS里做判断不就好了,我现在做www.uuusj.com就准备这么干,因为现在响应式的写法已经很常规 ...

你说的对,上次去了一个公司面试,他们要看我的作品,幸亏我做了IE8兼容,不然就糗大了。因为他们的设备都很陈旧。做我们这行的当然是希望用户都升级他们的设备,这样我们要考虑的也少一些,但是有些企业就是在设备上这么陈旧,没办法。
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

本版积分规则

QQ|小黑屋|Archiver|手机版|blueidea.com ( ICP05002321 )  

GMT+8, 2019-11-17 05:37 , Processed in 0.108124 second(s), 7 queries , Gzip On, Memcache On.

Powered by Discuz! X3.2 Licensed

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表