图片、按钮、文本框、文本区域 的 width 与 border、padding 关系

作者:vkvi 来源:千一网络(原创) 日期:2021-7-3

border 的大小是否算在 width 内呢?原来微软是算在里面的,后来标准是不算的。但是就算到目前为止,我们仍然不能一概而论。

以下测试在 Chrome 中测试。

我们关注以下几个控件:

  • img:img

  • button:<input type="button"

  • text:<input type="text"

  • textarea:textarea


未指定 DOCTYPE指定 DOCTYPE
img不含不含
button
text
不含
textarea不含

通常,我们是指定了 <!DOCTYPE html 的,所以我们只需要关注:button 与众不同即可。

再看看 padding


未指定 DOCTYPE指定 DOCTYPE
img不含不含
button
text不含
textarea不含

与 border 一样,只需要关注:button 与众不同即可。

相关文章