html文本区域背景颜色,html – 仅在文本周围的背景颜色

由于div的固定宽度,我在一个div中有一个H1超过1行.我想将背景颜色仅设置为H1文本,以便背景仅保留在文本后面(例如,如果行的末尾有空白空间,则不应使用背景颜色).

另外,我需要设置左右填充文本.我试图将填充设置为标题但它也不起作用.

这是我想要得到的：

我试图通过设置H1的内联显示和设置背景颜色来实现这一点,但它似乎不起作用.以下是我的HTML和CSS以及演示.

HTML：

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eget massa felis, at aliquam libero.

CSS：

.box{

background: green;

overflow: hidden;

max-width: 100px;

margin: 50px auto;

padding: 20px;

}

h1{

background: yellow;

font-size: 30px;

float: left;

display: inline;

}