首页 新闻 会员 周边

刚才看到一个input下border兼容性问题,解释有点看不懂,特来请教?

0
[已解决问题] 解决于 2012-07-22 08:57

原文是这样的:

input边框问题,正常浏览器border:none;便可解决,但是ie6的默认CSS样式,涉及到border的有border-style:inset;border-width:2px;必须对border的width和style进行全部设置方可消除IE6下的border。因为浏览器是先解析自身的默认CSS,再解析开发者书写的CSS,所以当有border-width或border-color设置的时候才会令IE6去解析border-style:none;目前所遇情况都能解释。因此想要去除input的border就只有使用border:0 none;虽然但看命令有些说不过去,但是这也是浏览器解析存在问题时较好的解决办法。

这里说“浏览器是先解析自身的默认CSS,再解析开发者书写的CSS”,也就是说开发者写的CSS优先级要高于浏览器默认的CSS,但为什么开发者写border:none;不能覆盖掉浏览器默认的border-style:inset;border-width:2px;呢?

请前端达人帮忙解释下,谢谢!

草根程序猿的主页 草根程序猿 | 初学一级 | 园豆:129
提问于:2012-07-10 09:53
< >
分享
最佳答案
1

各个浏览器的发行年代不一,执行的标准不一;各个浏览器使用的内核不同,对样式的解析方法也不同。浏览器之所以能显示网页,就是因为浏览器本身是可以根据自己设定的html解析方式对html页面进行“还原”显示。

 

默认的html是有一些样式的,比如:h系列的标题,H1最大,H6最小。一般设计师都会使用reset.css,在这个文件里,把所有的或者能涉及的html默认样式都重新定义一次,比如:* {margin:0;padding:0;}  img {border:none;}等...但是每个浏览器因为起自身对样式的概念和解释不尽一致,就出现了这个浏览器可以的方法,另一个浏览器不起作用的情况。常见的就是border,IE中有时候写border:none;他还是会显示边框,也就是说,IE对边框的理解是:必须有边框,但是可以是0宽度。

 

总结说就是每个浏览器都不尽是执行的网页设计标准,有时候用正常逻辑是无法达到我们的的效果的,因此要适当进行兼容模式的设置方法。

 

但是,虽然是适当兼容,还是尽量保证代码的标准和规范,border:0 none;写法不错,不过,两者的效果一致,运行不一致(有就渲染,没有就不渲染)。

奖励园豆:5
djyuning | 菜鸟二级 |园豆:213 | 2012-07-21 15:24
其他回答(1)
0

原文中不是说了吗:“当有border-width或border-color设置的时候才会令IE6去解析border-style:none;

在IE6中,当开发者写border:none;时,IE6并没有去解析开发者书写的这个CSS。

dudu | 园豆:31003 (高人七级) | 2012-07-10 13:25
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册