注册
登录
| 关键词： nbsp 浏览器 内核 问题 plaincopy 支持 html 实例 引擎 网页 |
以下内容参考与dandanzmc文章。什么是浏览器兼容问题？ 所谓的浏览器兼容性问题，是指因为不同的浏览器对同一段代码有不同的解析，造成页面显示效果不统一的情况。在大多数情况下，我们的需求是，无论用户用什么浏览器来查看我们的网站或者登陆我们的系统，都应该是统一的显示效果。所以浏览器的兼容性问题是前端开发人员经常会碰到和必须要解决的问题。为什么会出现浏览器兼容问题？浏览器兼容问题的出现，是因为各个浏览器对W3C标准支持的程度不同而导致的。如果网页都是一个标准的话，也不会又这种问题，但微软把自己当成了标准，不遵循网页的规范，所以一些网页即使语法错误也会在IE正常显示，而在FF，谷歌浏览器等不同内核的浏览器中出现“兼容问题”，其实是网页不遵循Web标准。当前主浏览器的核心是什么？ 1) Trident：IE浏览器使用的内核,该内核程序在1997年的IE4中首次被采用，是微软在Mosaic代码的基础之上修改而来的，并沿用到目前的IE7。Trident实际上是一款开放的内核，其接口内核设计的相当成熟，因此才有许多采用IE内核而非IE的浏览器涌现（如 Maxthon、TheWorld 、TT、GreenBrowser、AvantBrowser等）。 2) Geckos： Netcape6开始采用的内核，后来的FF也采用了该内核，Geckos的特点是代码完全公开，因此，其可开发程度很高，全世界的程序员都可以为其编写代码，增加功能。 3) Presto：目前Opera采用的内核，该内核在2003年的Opera7中首次被使用，该款引擎的特点就是渲染速度的优化达到了极致，也是目前公认网页浏览速度最快的浏览器内核，然而代价是牺牲了网页的兼容性。 4) Webkit：Safari浏览器使用的内核。Google的Chrome浏览器也是采用Webkit。Webkit引擎包含WebCore排版引擎及JavaScriptCore解析引擎，均是从KDE的KHTML及KJS引擎衍生而来，它们都是自由软件，在GPL条约下授权，同时支持BSD系统的开发。所以Webkit也是自由软件，同时开放源代码。在安全方面不受IE、Firefox的制约，所以Safari浏览器还是比较安全的浏览器。我整理的一些实例，都是在谷歌、IE7、IE8、IE9、IE10、FF中测试过。实例：1) 隐藏浏览器的滚动条问题： 隐藏浏览器的滚动条解决： 1) 只有ie7支持<bodyscroll="no"> 2) 除ie7不支持body{overflow:hidden} 3) 所有浏览器html{overflow:hidden}实例： 1) 只有ie7支持<body scroll="no">[html] view plaincopy<span style="font-size:18px;"> <body scroll="no" ></body></span> 2) 除ie7不支持 body{overflow:hidden}[html] view plaincopy<span style="font-size:18px;"> <body style="overflow:hidden" ></body></span> 3) 所有浏览器 html{overflow:hidden}[html] view plaincopy<span style="font-size:18px;"> <body style="overflow:hidden" ></body></span> 2) 禁用中文输入法的问题问题： 不能在输入框中输入汉字解决： 用ime-mode:disabled，只在ie系列和ff中有效，谷歌中，尚未找到方法实例：[html] view plaincopy<style type=text/css> body{text-align:center;width:900px;position: relative;margin:0 auto;padding:0;} #text{ background-position: center center; background-repeat: no-repeat;width:600px;height:400px;ime-mode:Disabled; } </style> [html] view plaincopy<body> <div style="margin-top:50px;"> <textarea type="text" id="text" onfocus="if(this.value=='切换输入法，在此输入中文试试...')this.value=''" title="试试">切换输入法，在此输入中文试试...</textarea> </div><br /><center>如不能显示效果，请按Ctrl+F5刷新本页</center> </body> 3) 禁用粘贴的问题问题： 不能将内容复制到输入框中解决： onpaste="returnfalse"，浏览器通用实例：[html] view plaincopy<style type=text/css> body{text-align:center;width:900px;position: relative;margin:0 auto;padding:0;} #text{ background-position: center center; background-repeat: no-repeat;width:600px;height:400px;ime-mode:Disabled; } </style>
声明：文章版权归原作者所有 部分文章转自互联网 如有侵权请联系
[邮箱地址] 删除
|
