如何解决DIV+CSS建站时对浏览器的兼容性问题

这篇文章给大家介绍如何解决DIV+CSS建站时对浏览器的兼容性问题，内容非常详细，感兴趣的小伙伴们可以参考借鉴，希望对大家能有所帮助。

在秦淮等地区，都构建了全面的区域性战略布局，加强发展的系统性、市场前瞻性、产品创新能力，以专注、极致的服务理念，为客户提供做网站、网站设计 网站设计制作定制网站制作,公司网站建设,企业网站建设,成都品牌网站建设,全网整合营销推广,外贸网站制作,秦淮网站建设费用合理。

DIV+CSS建站对浏览器的兼容性问题和注意事项

使用DIV+CSS构架好处不少，但也确实存在一些问题，现在让网页设计师最头疼的事莫过于DIV+CSS对浏览器的兼容性了，可能你用惯了IE6，做出来的东西没感觉到有多大异常，但是把同样的东西放到IE7里去看的话，就会发现很多问题，如果放到火狐浏览器里去看，结果更不尽人意。

一个页面从制作的开始就决定了他要使用的浏览器解析css模式，浏览器模式的不同，就造成了各个浏览器对页面显示的差异。浏览器解析css有两种模式,quirksmode和strictmode,目前正在使用的浏览器这两种模式都支持，在doctype声明中,没有使用DTD声明或者使用HTML4以下（不包括HTML4）的DTD声明时，基本所有的浏览器都是使用quirksmode呈现，其他的则使用strictmode解析。

这两种模式***的不同就是提现在对盒模式的解释上。什么是盒模式？这是针对块级元素说的，这里简单说一下，说白了就是把块级元素想像成一个装东西的盒子，而margin,padding,border,width这些css属性构成了盒模式。而区别就是产生在width属性上。

◆在strictmode中：

width是内容宽度，也就是说,元素真正的宽度=margin-left+border-left-width+padding-left+width+padding-right+border-right-width+margin-right;

◆在quirksmode中：

width则是元素的实际宽度，内容宽度=width-(margin-left+margin-right+padding-left+padding-right+border-left-width+border-right-width)

DIV+CSS建站时要注意的事项：

◆内联元素，例如、等，定义上下边界不会影响到行高(line-height)，内联元素距离上一行元素的距离由行高决定，而不是填充或边界。注2.内联元素(display:inline)内联元素不需要在新行内显示，而且也不强迫其后的元素换行，如a、em、span等都为内联元素。内联元素可以为任何其他元素的子元素。

◆浮动元素(无论左或者右浮动)边界不压缩，且若浮动元素不声明宽度，则其宽度趋向于0，即压缩到其内容能承受的最小宽度。

◆如果盒中没有内容，则即使定义了宽度和高度都为100%，实际上只占0%，因此不会被显示，此点在采取层布局的时候需特别注意。

◆边界值可为负，其显示效果各浏览器可能不相同。

◆填充值不可为负。

◆边框默认的样式(border-style)为不显示(none)

其他注意事项：

1.float的div一定要闭合，即清除浮动

示例：(其中floatA、floatB的属性已经设置为float:left;)