html - 如何使用 CSS 将两个标题并排放置？

Question

<h5>Category</h5><h6>auto</h6>

将Category和auto放在不同的行上，如下所示：

类别

我怎样才能将它们放在同一条线上，像这样？

score 29 · Accepted Answer

h(n) 元素是“块”元素，这意味着它们将增长到占用所有可用的水平空间。这也意味着他们会将任何“正确”的东西推到下一行。

实现此目的的一种简单方法是将其显示设置为内联：

<style>
    h5, h6 {display:inline;}
</style>

请注意，inline-block并非所有浏览器都支持。

您也可以浮动块元素，但这可能会成为一个棘手的问题，因为浮动可能相当复杂。在这种情况下坚持使用内联。

score 7 · Accepted Answer

7

<h5 style="display:inline-block;">Category</h5>
<h6 style="display:inline-block;">auto</h6>

于 2009-08-18T14:40:45.927 回答

score 3 · Accepted Answer

您必须更改元素的显示模式。H 标签默认呈现为 BLOCK 元素。要覆盖此行为，请将以下样式定义添加到您的网站或 CSS

h5,h6 { display: inline; }

您还可以决定让它们“漂浮”在彼此旁边，您可以通过以下方式做到这一点：

h5,h6 { float: left; }

请注意，浮动仅适用于块元素（因此使用两种样式都不会执行浮动，因为内联元素不能浮动）。