从css的角度说,border就是用来画边框的;而从兼容角度说,有这么个问题(举例):

<div style="width:300px;border:5px solid">123</div>

以上代码,在firefox等浏览器下,边框加内容的总宽度是310px,而在ie6下是300px。也就是,ie6会把border的宽度算在width里面,而其它算在width外面。如果width是%值的话,差距会更大。那么,为了避免来处理这个兼容问题,采用了另一个写法:用背景色:

<div style="width: 300px;"> <div style="background:#000;padding:5px"> <div style="background:#fff">123</div> </div> </div>

这样子,在各个浏览器下加上黑色边框的宽度都是300px了,不过代码也因此变累赘了许多。

还是回到border,给其多套一层:

<div style="width:300px"><div style="border:5px solid">123</div></div>

这应该是最完美的写法。