css背景颜色扩展到文字？

Question

我将如何设置文本的背景颜色不扩展为其父级的宽度div？我用h1{background color:white;}并围绕我想要的文字包装h1，但白色背景只是延伸到文本之外。这几乎就像你只是强调单词。

Answer 1

h1是一个块元素，所以它将使用所有可用的区域。所以改变这个元素内联，只使用其宽度

h1 { 
    display: inline; 
    background-color: white; 
} 

http://jsfiddle.net/wxNQR/

Answer 2

问题是，h1是块级元素，默认情况下，块级元素将展开以填充父元素的所有可用宽度。

解决这个最简单的方法是float元素：

h1 { 
    background-color: white; 
    float: left; 
} 

然后，您将需要的款式下段，使其不流动一轮的标题元素：

p { 
    clear: left; 
} 

如果您不习惯支持IE7及以下版本，则可以使用相邻的兄弟选择器来使此选项更加整洁，以便在h1元素之后直接使用p元素：

h1 + p { 
    clear: left; 
}