网页错乱问题的几种解决办法

有时候由于网站兼容性的问题,会出现网页错乱的问题。关于网页错乱的问题在网页设计的时候就可以解决。下面我们就来说说如何解决一些网页错乱的问题。
众所周知,国内的主流浏览器都是双核浏览器:基于IE的内核的“兼容模式”,一般用于兼容网银、旧版网站,以及基于Webkit内核的“极速模式”。各大浏览器面对不同网页在不同模式上的处理方法大同小异,以国内360浏览器为例:
360安全浏览器内置了两种网页浏览模式:极速模式和兼容模式,我们会自动为您选择使用适合每个网站的浏览模式。点击地址栏的内核切换按钮,可以手动切换浏览模式。
极速模式采用了全球最快、最新的chromium内核和IE9内核,可以手动切换内核。
由于部分网页在极速模式下出现兼容性问题,显示不正常,这时您可以手动切换到兼容模式来浏览网站。
以上方法虽然在一定程度上解决了网页在不同浏览模式下兼容的问题,但是仍存在一些缺憾:
极速模式对于新网站的一些特效渲染的很好,但是“兼容模式”对于css3修饰的效果并不感冒。那么如果一个采用css3的网站遇到客户使用“兼容模式”怎么办?
网页错乱一些解决方法:
360官方给出的办法:
新增加了一个控制手段:内核控制meta标签。只要你在自己的网站里增加一个meta标签,告诉360浏览器这个网址应该用哪个内核渲染,哪么360浏览器就会在读取到这个标签后,立即切换对应的内核。并将这个行为应用于这个二级域名下所有网址。比如,若页面需默认用极速核,增加标签:ta name="renderer" content="webkit">
但这样也存在一个问题。如果处理国内其他浏览器,以及那些未知名的浏览器甚至将来可能出现的浏览器?这样的解决方发存在风险。
更合适的方法:
经过研究,发现了支持css3与不支持css3的浏览器的一些共同属性,就是说,所有不支持css3的浏览器在我们这种判断中被判断为0,所有支持css3的浏览器被判断为1,和浏览器开发商无关,直接和浏览器当前模式能否正常渲染css3挂钩。包括ie8,ie8也不能渲染css3,同样会被判断为不支持css3的浏览器。然后,我们判断到不支持css3则做温馨提示窗,提醒客户切换模式或者下载谷歌浏览器。客户可以选择切换,然后我们用gif或者图片形式的教程教客户如何切换,客户选择下载,则把客户带入谷歌浏览器下载页面,客户选择取消,则不做其他处理。
上面也提到,如果客户啥也不做呢?难道我们就什么都不管?不行,我们需要做最后的预防措施,在编写代码的时候就要考虑到,我们的这种处理万一在不能支持的浏览器下怎么办?答案是:平稳退化。何为平稳退化,即保证在不能兼容的浏览器底下做最小的**,比如一个渐变的css3效果,在ie8或者国内浏览器的兼容模式下,我们要保证页面样式,效果基本不会出现bug,仅限制在css3的过度效果这一块不能实现,不支持的则直接切换,不给于过度处理,则能在不支持的浏览器下平稳退化而不至于是页面不能正常运行。
