如何防止标题(<h1>)占用比他们需要的更多宽度?</h1>

时间:2010-01-23 19:14:53

标签: html css width

如果我定义类似<h1>的标题,则默认情况下其宽度设置为100%。

有没有办法确保其宽度设置为可能的最小值?

4 个答案:

答案 0 :(得分:36)

你可以给它display: inline。这将使其行为与任何文本元素相同 - <h1>的默认值为display: block

还有其他方法:例如float: left,但我发现这是最简单的,副作用最少的。

请注意,您可能需要添加<br>以确保在<h1>之后换行。

答案 1 :(得分:20)

而不是display: inline,请给它display: inline-block。除了100%的宽度外,这将保留h1标签的块状质量。

答案 2 :(得分:4)

它是块级元素,因此它遵循display:block的规则。您可以设置display:inline,这可能会根据具体情况做您需要与否的事。

答案 3 :(得分:1)

  

是否有办法确保其宽度设置为尽可能小的值

我认为width: fit-content;更好。

https://jsfiddle.net/fqk1a2v6/