h1标签中有两行

Ode*_*rth 51 html css

我需要在一个h1标签中插入两行(而不是两个分开的h1标签).

如何在h1标签内创建换行符?

Tom*_*ers 80

使用:

<h1>Line 1 <br/> Line 2</h1>
Run Code Online (Sandbox Code Playgroud)

  • 很确定这是有效的 - 至少在HTML 5中! (5认同)
  • 有关完成此操作的有效html方式,请参见下面的JWorks Studios答案。 (2认同)

小智 20

W3C验证方法是

<h1>Line 1 <span style = "display: block;">Line 2</span></h1>
Run Code Online (Sandbox Code Playgroud)


zou*_*oul 10

你可以在里面插入标记h1,这样你就可以做到<h1>foo<br>bar</h1>.


mar*_*nuy 7

总结所有聪明的答案,这就是https://validator.w3.org对每个答案所说的:

已验证:

<h1>Line 1 <br/> Line 2</h1>
<h1>Line 1<br>Line 2</h1>
<h1>Line 1 <span style = "display: block;">Line 2</span></h1>
Run Code Online (Sandbox Code Playgroud)

无效

<h1>
    <p>Line1</p>
    <p>Line2</p>
</h1>
Run Code Online (Sandbox Code Playgroud)

原因:

错误:在这种情况下,元素p不允许作为元素h1的子元素


<h1>
  <div>line1</div>
  <div>line2</div>
</h1>
Run Code Online (Sandbox Code Playgroud)

原因:

错误:在这种情况下,元素div不允许作为元素h1的子元素。


经过测试的代码:

<!DOCTYPE html>
<html>
<head>
<title>test</title>
</head>
<body>
<h1>Line 1 <br/> Line 2</h1>
<h1>Line 1<br>Line 2</h1>
<h1>
    <p>Line1</p>
    <p>Line2</p>
</h1>
<h1>Line 1 <span style = "display: block;">Line 2</span></h1>

<h1>
  <div>line1</div>
  <div>line2</div>
</h1>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)


Cir*_*四事件 6

br内部h1有效的标准报价

让我们教更多的人阅读现行标准

4.3.6 “h1、h2、h3、h4、h5 和 h6 元素”说:

内容模型:措辞内容。

然后我们单击“Phrasing content”的定义,这会导致3.2.5.2.5“Phrasing content”,其中显示:

措辞内容是文档的文本,以及在段落内标记该文本的元素。连续的措辞内容形成段落。

...、br、...、跨度、...

所以我们看到它br在短语内容元素的巨大列表中,因此可以进入内部h1

这也向我们表明另一种选择是执行以下操作:

<h1><span>ab</span><span>cd</span></h1>
Run Code Online (Sandbox Code Playgroud)

然后用CSS制作spanbe 。display: inline-block;