现在有一个div,边框设置为1px,宽度设为100px.
问题:是不是宽度100px不包括边框啊,如果加上边框,宽度就应该是102,我是这样理解的,不知道对不对,请大牛指点,谢谢。
的确是这样的,一个DIV有100的宽+左边边框1px+右边边框1px=102px,同样的高度增加了。
在firefox,opera等中的宽度就是指元素本身的 width。它只包含元素中内容的 width。
而IE 中的 width 则是指整个容器的 width,包括元素,padding ,border。
所以
FF 中是加法:容器的宽度=元素 width+padding +border
IE中是减法:元素宽度=容器 width-padding -border
你看下BOX模型就明白了,Border就是Border,还有Padding、Margin加上后,你那个div的长宽就更不一样了,各浏览器解释的还不一样。
老版本的浏览器们对CSS的解释相当的不统一,不过现在趋势是越来越统一了。
要完全实现所有浏览器中的表现一样,是个艰巨的任务,有时候还需要借助JS,你们最好跟客户协商一下需要兼容的浏览器,需要兼容的浏览器各类越少,对你就越有利。
不管什么浏览器,边框线都要占一个像数,所以你的div 宽为100 你就可设为98,另两个宽度就为边框