如何使用CSS将两个标题彼此相邻放置? [英] How can I place two headings next to each other using CSS?

问题描述

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

将类别和自动放置在单独的行中，如下所示:

places Category and auto on separate lines, like this:

如何将它们像这样放置在同一行上?

How can I place them both on the same line, like this?

推荐答案

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

h(n) elements are 'block' elements, which means they will grow to take all available horizontal space. This also means they will push anything "right" of them down to the next line.

一种简单的方法是将其显示设置为内联:

One easy way to accomplish this is to set their display to inline:

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

请注意，并非所有浏览器都不支持内联阻止.

Note that inline-block is not supported in all browsers.

您还可以浮动块元素，但是由于浮动可能非常复杂，因此这可能会成为一个棘手的问题.对于此类情况，请坚持使用内联.

You can also float block elements, but that can become a sticky issue as floating can be fairly complex. Stick with inline for cases like this.

这篇关于如何使用CSS将两个标题彼此相邻放置?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！