html - 内联文本 - 带填充的背景颜色

Question

我需要制作一个背景颜色不是 block 的标题(只有文本背景是彩色的)。

这是我要实现的目标的图像:

到目前为止，这是我得到的: http://jsbin.com/tiwuquze/1/edit

你可以看到填充不正确，我不知道如何设置它。当您尝试填充时，您会发现它会重叠并且第二行不会像第一行那样进入。

我对每一个提示都很满意!

解决方案:

John Smith 做了一个工作示例:http://jsbin.com/tiwuquze/21/edit他使用 box-shadow 来模拟左内边距。

Answer 1

更新得到解决方案，使用框阴影 :D

h1 {
    background-color: #FE8020;
    color: #FFFFFF;
    display:inline;
    white-space:pre-wrap;
    line-height : 24px;
    font-size: 18px;
    font-family:arial, sans-serif;
    padding: 5px;
    padding-left:0px;
    box-shadow: -16px 0 0 #FE8020; /* box shadow is emulating padding liek a charme */

}

我觉得不错

http://jsbin.com/tiwuquze/21/edit