Question

我有以下HTML标记，这会导致text类型的输入表单元素。

<!DOCTYPE html>
<html>
    <body>
        <input type="text" />
    </body>
</html>

在一个不错的浏览器中，它会像下面的屏幕截图一样呈现（右侧是缩放的图像）：

Sample

那么，为什么在检查<input>元素时，浏览器会显示 2px 的边框宽度？我们可以在视觉上欣赏输入元素具有 1像素。即使使用jQuery，当我执行类似jQuery('input').css('border-width')的操作时，它也会吐出 2px 。

当然，只有使用无格式表单输入元素才会发生。

我还创建了一个JsFiddle演示：http://jsfiddle.net/HBDUZ/

谢谢！

Answer 1

每个浏览器都有一个内置样式表（称为＆＃34;用户代理样式表＆＃34;），其中包含某些元素的默认样式。

在这种情况下（Chrome 25 beta-m，Windows），样式为：

border: 2px inset;

inset的结果在此JSFiddle中非常明显，背景颜色形成鲜明对比。