如何设计网页适应各种的浏览器

2019-09-28 14:11:46 100000+ 编辑：推外网络来源：本站原创

我喜欢同时在自己的电脑上安装几个浏览器，并按工作的不同转换使用这些浏览器。但这需要你给所有爆出的浏览器安全漏洞及时地打补丁，而且在不同的浏览器间转换使用会非常麻烦，例如，你不得不在不同浏览器间复制URL，有时你还需要更改浏览器的默认设置。（工作需要嘛，做出的网站要适应各种浏览器，我们要进行测试的）

个人而言，我比较喜欢Opera、、谷歌Chrome和全新的Safari4beta（迄今为止，还是不怎么喜欢IE8）。如果你也不喜欢微软IE，那么笔者推荐你还是使用Firefox，原因其实很简单——Firefox是最为成熟的IE替代品。

　　经过多年的研究，虽然没有办法做出让所有浏览器都兼容的网站，但注意一些问题点，做出的网页在大做出来的网页在各个浏览器都中能达到比较好的显示效果：

　　1.不要混合使用层和表格排版，如果是父子关系，如层中表格，不在此原则范围内。

　　2.内联式的CSS在NetscapeNavigator中经常会出现问题，使用链式或内嵌式。

　　3.有时需要在空层插入表格或者透明图片，以保证在NetscapeNavigator里的效果。

　　4.对于只有几个像素宽度或高度的层，改用图片来实现。

　　5.避免使用W3C组织不推荐的排版属性，用CSS代替。这就是我们一直强调的做‘标准’网页.

第二种方法：做两个适合不同分辨率的页面，一个是800×600，一个是1024×768，在800×600的页面中加入一下代码就可以实现跳转了：

　　　解决分辨率问题在Dreamweaver中没有此项功能，我们只能手动加入一段Javascript代码。首先在change－ie.html或change－nc.html页面代码中的<head>和</head>中加入以下代码：　　　　

　　<scriptlanguage=JavaScript>　　<!－－　　functionredirectPage(){　　varurl800x600=〃index－ie.html〃;//定义两个页面，此处假设index－ex.html和1024－ie.html同change－ie.html在同一个目录下　　varurl1024x768=〃1024－ie.html〃;　　if((screen.width==800)＆＆(screen.height==600))　//在此处添加screen.width、screen.height的值可以检测更多的分辨率　　window.location.href=url800x600;　　elseif((screen.width==1024)＆＆(screen.height==768))　　window.location.href=url1024x768;　　elsewindow.location.href=url800x600;　　}　　//－－>　　</script>　　然后再在<body…>内加入onLoad=〃redirectPage()〃　　最后，同样地，在<body>和</body>之间加入以下代码来显示网页的工作信息：

　　<scriptlanguage=JavaScript>　　<!－－　　varw=screen.width　　varh=screen.height　　document.write(〃系统已检测到您的分辨率为:〃);　　document.write(〃<fontsize=3color=red>〃);　　document.write(w＋〃×〃＋h);　　document.write(〃</font>〃);　　document.write(〃正在进入页面转换,请稍候…〃);　　//－－>　　</script>

如何设计网页适应各种的浏览器还需要经过更多的研究和努力..也期待一个更优秀的兼容网页的浏览器.

本站文章均为推外网络摘自权威资料，书籍，或网络原创文章，如有版权纠纷或者违规问题，请即刻联系我们删除，我们欢迎您分享，引用和转载，我们谢绝直接复制和抄袭！感谢...

返回首页上一篇：用户体验重于一切下一篇：修改域名解析后，访问域名的时候还是访问老IP，解决方法