网页页面错乱 警惕<input>等控件的border

在布局网页时，页面会发生错位，怎么也调整不好，你会纠结于到底是哪里宽了 ，哪里高了。

这时你可以先用同样宽高的<img>换掉那些<input>等控件，把页面调整规范。再换回去，你发现页面乱了，原因就在这里。

为什么同样大的会使页面错位了？因为<input>有默认的border，而且不同浏览器不同（在IE 中document.getElementById("mxh").currentStyle.borderStyle测量控件的border），这样就必须显式的声明才可以，例如：

<input type="text" name="textfield" id="textfield" style="border:1px solid red" />

其他控件同理。

刘国柱作于2011-12-30

原创文章转载请注明出处