Question

我有一个页面，我只想制作标题。此标头是左侧对齐的<h1>文字，右侧对齐的<h2>位于同一行，后面是<hr>。到目前为止，我的代码如下所示（如果你测试它，你会发现它是错误的）：

<h1 align="left">Title</h1> 
<h2 align="right">Context</h2> 
<hr/>

谢谢你们！

Answer 1

h1和h2是原生的display: block元素。

让他们display: inline，使他们的行为与普通文字一样。

您还应该重置元素所具有的默认padding和margin。

Answer 2

关键字float：

<h1 style="text-align:left;float:left;">Title</h1> 
<h2 style="text-align:right;float:right;">Context</h2> 
<hr style="clear:both;"/>

Answer 3

在许多情况下，

display:inline;

就够了。

但在某些情况下，您必须添加以下内容：

clear:none;

Answer 4

将h1和h2放入ID为container的容器中，然后：

#container {
    display: flex;
    justify-content: space-beteen;
}

Answer 5

回答问题标题（由Google搜索找到），而不是重新提问当您使用不同的标题标签时，例如，要停止换行

<h5 style="display:inline;"> What the... </h5><h1 style="display:inline;"> heck is going on? </h1>

会给你：

...到底是怎么回事？

不是

那... 到底是怎么回事？（堆栈不会让我换行，大声笑...无论如何希望你有主意。

Answer 6

<h1 style="text-align: left; float: left;">Text 1</h1>
<h2 style="text-align: right; float: right; display: inline;">Text 2</h2>
<hr style="clear: both;" />

希望这有帮助！

如何在同一行写入h1和h2？

6 个答案: