CSS 你如何缩进 <span> 元素的*每一*行？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2512443/
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
How do you indent *every* line of a <span> element?
提问by Nathan Osman
I have the following HTML chunk:
我有以下 HTML 块：
<span class='instruction_text'>
Line 1<br>
Line 2
</span>
And the CSS declaration of instruction_text is:
而instruction_text 的CSS 声明是：
.instruction_text {
margin-left: 70px;
font-style: italic;
color: #555;
}
The first line has a 70pxmargin as expected, but the next line starts with no indent. How can I make ALL of the lines indented?
第一行有70px预期的边距，但下一行没有缩进。如何使所有行缩进？
采纳答案by bcherry
Use a block-level element. <div>is block-level by default, but adding the CSS display:blockto your instruction_textclass should send you in the right direction.
使用块级元素。 <div>默认情况下是块级的，但是将 CSS 添加display:block到您的instruction_text类应该会向您发送正确的方向。
回答by jonhobbs
Using BR tags inside a SPAN element doesn't make a lot of sense as SPAN in an inline element which means it's meant to be used in the flow of a line of text or other inline elements.
在 SPAN 元素中使用 BR 标签没有多大意义，因为在行内元素中使用 SPAN 意味着它旨在用于一行文本或其他内联元素的流中。
You really should be using an element that is a "block" level element like DIV or P, e.g. one that is designed to contain multiple lines of text (or inline elements).
您确实应该使用像 DIV 或 P 这样的“块”级元素，例如，设计为包含多行文本（或内联元素）的元素。
As you'll have noticed, you CAN use a BR tag inside a SPAN and it will cause a line break, however inline elements don't play well with margins/padding etc.
正如您所注意到的，您可以在 SPAN 内使用 BR 标签，这会导致换行，但是内联元素在边距/填充等方面效果不佳。
