为啥无样式输入文本的边框宽度为 2px？
Posted
技术标签:
【中文标题】为啥无样式输入文本的边框宽度为 2px？【英文标题】：Why unstyled input text has a border width of 2px?为什么无样式输入文本的边框宽度为 2px？ 【发布时间】：2012-12-31 12:34:07 【问题描述】：我有以下 html 标记，这些标记会生成文本类型的输入表单元素。
<!DOCTYPE html>
<html>
<body>
<input type="text" />
</body>
</html>
在一个不错的浏览器中，它呈现如下屏幕截图（在右侧是缩放的图像）：
那么，为什么在检查<input> 元素时，浏览器显示的边框宽度为2px？我们可以直观地了解输入元素有 1 个像素。即使使用 jQuery，当我执行 jQuery('input').css('border-width') 之类的操作时，它也会吐出 2px。
当然，这种情况只发生在无样式的表单输入元素中。
我还创建了一个 JsFiddle 演示：http://jsfiddle.net/HBDUZ/
谢谢！
【问题讨论】：
浏览器默认样式表。 我猜这就是您的浏览器设置为使用默认样式呈现文本字段的方式。例如，在 ios 上的 Chrome 中，文本字段对我来说是“1px”。 (iPhone) 【参考方案1】：每个浏览器都有一个内置样式表（称为“用户代理样式表”），其中包含某些元素的默认样式。
在本例中（Chrome 25 beta-m，Windows），样式为：
border: 2px inset;
inset 的结果在这个JSFiddle 中确实可见，具有对比色背景。
【讨论】：
以上是关于为啥无样式输入文本的边框宽度为 2px？的主要内容，如果未能解决你的问题，请参考以下文章
富文本内容里的图片放在h5适应（大于边框的宽度/300的宽度适应，其余不变，样式取消掉）