CSS:如何在元素的内容之前添加空白?

以下代码均不起作用:

p:before { content: " "; } p:before { content: " "; } 

如何在元素内容之前添加空白区域?

注意:我需要给边界左边和边缘左边的颜色着色,并将空间用作无色边缘。 🙂

你可以使用非破坏空间的unicode:

 p:before { content: "\00a0 "; } 

JSfiddle演示

[风格由@Jason Sperske改进]

不要插入空格放屁。 对于一个,旧版本的IE不知道你在说什么。 除此之外,总的来说还有更清洁的方法。

对于无色缩进,请使用text-indent属性。

 p { text-indent: 1em; } 

JSFiddle演示

编辑:

如果你想要空间被着色,你可以考虑在第一个字母上加一个粗的左边框。 (我几乎 – 但不是相当的说“,因为缩进可以是一个问题,如果你同时使用它,但我觉得肮脏的只依靠边界缩进)。你可以指定多远,以及多宽,颜色使用第一个字母的左边距/填充/边框宽度。

 p:first-letter { border-left: 1em solid red; } 

演示

既然你正在寻找在元素之间增加空间,你可能需要一些简单的东西,比如左边的空白或左边的填充。 这里是http://jsfiddle.net/BGHqn/3/的例子;

这将在段落元素的左侧添加10个像素

 p { margin-left: 10px; } 

或者如果你只是想在你的段落元素内填充一些内容

 p { padding-left: 10px; }