如何使用CSS为文本的宽度而不是整个元素的宽度设置背景色？

Question

我想要的是绿色背景位于文本的后面，而不是页面宽度的100％。这是我当前的代码：

h1 {

    text-align: center;

    background-color: green;

}


<h1>The Last Will and Testament of Eric Jones</h1>

Answer 1

将文本放在嵌入式元素中，例如<span>。

<h1><span>The Last Will and Testament of Eric Jones</span></h1>

然后将背景颜色应用于内联元素。

h1 {
    text-align: center; 
}
h1 span { 
    background-color: green; 
}

内联元素与其内容一样大，因此应该为您完成。