你好,欢迎访问远方教程PC版!
广告位招租

Div+CSS速成第十天:div+css网页标准布局实例三(第6页)

[日期:2015-04-19]   来源:远方教程  作者:远方教程   阅读:9133次[字体: ] 访问[旧版]
 捐赠远方教程 

 

如上图,先点1中的查看页面元素按钮,然后鼠标移动到2的地方,将会出现图中所示的蓝色线框,然后点击鼠标,会在插件中选中3位置的代码并在4位置出现对该区域生效的所有样式,即是上边框选部分的代码和样式,当鼠标移动到圈4位置时,会出现一个禁止图标,点击后禁用当前样式,这样便于查找问题所在,另外还可以在后边双击插入新的样式。
另外,如果你装的是IE8浏览器,同样具备类似的功能,打开浏览器后,按F12键,即可打开该功能,使用方法和火狐的firebug类似。
希望大家多多研究,对查找问题能起到事半功倍的效果。不过这些修改只停留在浏览器层面,不会对你本地和服务器上的文件做任何改动,查找到哪里出问题后,及时在dw里将出错的地方改过来。
学会了怎么调试页面后,兼容问题也是一个不容忽视的问题,现在浏览器市场鱼龙混杂,别的不说,IE的6/7/8版本兼容就够让人头疼了,现在又出了个IE9,还有火狐、chome、opera、Safari等等,而且标准不统一,一片混乱的状况。从下图中标准之路网站的访问情况来看,目前IE6仍然占最大比重,而IE6恰恰也是让设计者最为头疼的浏览器,bug太多了。鉴于这种混乱情况,目前只用考虑兼容最常用的IE6/7/8和firefox就可以了,其它使用人数很少的浏览器可以暂不考虑。只要我们掌握了各个浏览器的特性,避免一些使它解析错误的写法,还是不用太多的css hack就可以使页面在各个浏览器下显示基本一致,所以这个需要大家的多观察,多实践,多总结。

DIV CSS教程——第十天_div css网页标准布局实例

因IE浏览器的特殊性,一台电脑同时只能装一个版本的IE浏览器,不过呢有高人提供了IE Tester,把IE的几个版本集成到一块,专门供测试兼容使用。大家可以下载安装一下,测试下页面在各个浏览器下的显示效果。

DIV CSS教程——第十天_div css网页标准布局实例

图片展示
 
相关评论
站长推荐