HTML 按钮的默认显示模式是什么？

Question

HTML中的每个元素都有一个默认的显示方式，如“块”、“内联”等。例如，“div”显示为“块”，“span”显示为“内联”。

我需要像“按钮”元素这样的显示模式。它更像是“内联”，因为您可以将它们中的一些放在一行中，但与“内联”不同的是，它们可以具有宽度属性。

好吧，够了，让我们回到我的问题。 HTML按钮有哪些显示方式？

原文由 Milad Rahimi 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

默认情况下，按钮是 inline-block ，因此没有换行符的多个按钮或一些按钮将彼此相邻显示：

 <button>button 1</button>
<button>button 2</button>

如果您希望它们位于彼此之下，您可以将它们显示为 block ：

 button {
  display: block;
}

 <button>button 1</button>
<button>button 2</button>

原文由 GreyRoofPigeon 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

通过将按钮的显示值更改为 block，您可以像这样轻松地将它居中：（假设它有一类 btn）

 .btn{
    display: block;
    margin: 2em auto;
}

原文由 Sanaz Bahmani 发布，翻译遵循 CC BY-SA 4.0 许可协议