css - 按钮边框出现在对象高度内

Question

这不是一个主要问题，因为它可以很容易地通过一些 CSS 进行调整——这正是我想知道的。为什么边框出现在按钮元素的高度之内而不是外面，按照盒子模型？在下面的示例中，我有一个按钮元素和一个 anchor 元素。高度均为 30px，边框为 1px。然而，按钮元素看起来比 anchor 高 2 像素(在总高度 32 像素处正确显示)。

http://jsfiddle.net/Y9Rv7/1/

谢谢

Answer 1

将此添加到样式中应该可以解决您的问题

box-sizing: content-box

这将使元素按照您的意愿呈现。我相信默认情况下，按钮会呈现边框框行为，这会导致填充和边框被添加到内部框内。