为什么复选框可以有顶部/底部边距？

问题描述：

input[type=checkbox] { margin-top: 50px; }

但不是这样的：

span { margin-top: 50px; }

两个元素是display: inline;，而据我能够收集，既不inline也不inline-block元素都应该能够有垂直边际。然而，复选框似乎违反了这条规则...

他们是'直列block'而不是'inline'，而且至少Chrome浏览器甚至不会让你将其更改为'显示：inline'， – 2013-04-25 20:48:39

@ExplosionPills：原来，萤火虫误报他们为' inline'。 – FtDRbwLXw6 2013-04-25 20:56:45

答

因为它们是inline-block元素，就像<textarea>或<button> ..您当然可以将所有内容应用于可以作为块级元素的嵌入块元素。

啊，我明白了。 Firebug报告说，该元素绝对是“内联”的。我想知道这是否是Firebug中的一个bug。感谢您关于'inline-block'的信息。 – FtDRbwLXw6 2013-04-25 20:51:37

答

inline-block元素实际上可以有垂直边距。