中心段与背景

Question

我想知道如何使用背景居中（宽度）一个段落。

像这样

非常感谢：）

<div class="about_content">
<h1>Devenez le maitre de vos réseaux !</h1>
<p>Bienvenue dans la nouvelle bulle d’échange d’informations “Spotlinks” <br>Echangez et connectez sur le moment  vos données sociales et professionnelles</p>
</div>

.about_content {
padding: 200px;
h1{
font-size: 53px;
color: white;
text-align: center;
text-shadow: 2px 2px #333;
}
p {
text-align: center;
background: white;
color: $text-color;
display: inline-block;
}
}

Answer 1

行。那么问题是因为<p>是块级元素，如果你给它一个背景色，它将跨越整个宽度。

解决方法是在<span>标记内添加<p>标记，并在<span>上设置背景颜色，因为默认情况下它是内联元素。您还需要将<span CSS设置为display:inline-block

<强> JSFiddle Demo

<强> HTML：

<div class="container">
    <p><span>My text here</span></p>
</div>

<强> CSS：

.container { background:#ccc; padding:10px;}
p { text-align:center; }
p span { display:inline-block; background:#fff; padding:5px;}