如何将html元素的宽度约束为所述元素的内容？

Question

我有一个标题，我想根据其中的内容调整大小。不是动态的，仅针对一个标题。

编辑：以下内容对问题没有影响（但人们对各种废话抱怨）

h1 {
  margin: auto auto 10px 10px;
  padding-left: 6px;
  border-bottom: 4px outset #227777;
  box-shadow: 0px 3px 10px black;
}

Answer 1

我假设你说你只希望H1元素与其中的文本一样宽。如果是这种情况，您需要设置display: inline;。

h1 {
  margin: auto auto 10px 10px;
  padding-left: 6px;
  border-bottom: 4px outset #227777;
  box-shadow: 0px 3px 10px black;
  display: inline;
}

<div>
<h1>Heading</h1>
</div>