CSS：如何在元素内容之前添加空格？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16552397/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS: how to add white space before element's content?
提问by Hugolpz
None of the following code works :
以下代码均无效：
p:before { content: " "; }
p:before { content: " "; }
How do I add white space before element's content ?
如何在元素内容之前添加空格？
Note: I need to color the border-left and the margin-left for semantic use and use the space as colorless margin. :)
注意：我需要为 border-left 和 margin-left 着色以供语义使用，并将空间用作无色边距。:)
回答by Hugolpz
You can use the unicode of a non breaking space :
您可以使用非中断空间的 unicode ：
p:before { content: "p { text-indent: 1em; }
a0 "; }
See JSfiddle demo
[style improved by @Jason Sperske]
[@Jason Sperske 改进的风格]
回答by cHao
Don't fart around with inserting spaces. For one, older versions of IE won't know what you're talking about. Besides that, though, there are cleaner ways in general.
不要在插入空格时放屁。一方面，旧版本的 IE 不知道你在说什么。不过，除此之外，一般还有更清洁的方法。
For colorless indents, use the text-indentproperty.
对于无色缩进，请使用该text-indent属性。
p:first-letter { border-left: 1em solid red; }
Edit:
编辑：
If you want the space to be colored, you might consider adding a thick left border to the first letter. (I'd almost-but-not-quite say "instead", because the indent can be an issue if you use both. But it feels dirty to me to rely solely on the border to indent.) You can specify how far away, and how wide, the color is using the first letter's left margin/padding/border width.
如果您希望空间被着色，您可以考虑在第一个字母上添加一个粗的左边框。（我几乎但不完全说“相反”，因为如果你同时使用缩进可能是一个问题。但我觉得仅仅依靠边框来缩进是肮脏的。）你可以指定多远，以及颜色使用第一个字母的左边距/填充/边框宽度的宽度。
p {
margin-left: 10px;
}
回答by Matt
Since you are looking for adding space between elements you may need something as simple as a margin-left or padding-left. Here are examples of both http://jsfiddle.net/BGHqn/3/
由于您正在寻找在元素之间添加空间，您可能需要像 margin-left 或 padding-left 这样简单的东西。以下是http://jsfiddle.net/BGHqn/3/ 的示例
This will add 10 pixels to the left of the paragraph element
这将在段落元素的左侧添加 10 个像素
p {
padding-left: 10px;
}
or if you just want some padding within your paragraph element
或者如果您只想在段落元素中添加一些填充
/* Most Accurate Setting if you only want
to do this with CSS Pseudo Element */
p:before {
content: "##代码##a0";
padding-right: 5px; /* If you need more space b/w contents */
}
