你如何缩进<span>元素的每一行？</span>

Question

我有以下HTML块：

<span class='instruction_text'>
  Line 1<br>
  Line 2
</span>

instruction_text的CSS声明是：

.instruction_text {
  margin-left: 70px;
  font-style: italic;
  color: #555;
}

第一行的预期余量为70px，但下一行的开头没有缩进。如何缩进所有行？

Answer 1

使用块级元素。默认情况下，<div>是块级别，但将CSS display:block添加到instruction_text类应该会向您发送正确的方向。

Answer 2

在SPAN元素中使用BR标记在内联元素中作为SPAN没有多大意义，这意味着它意味着在一行文本或其他内联元素的流中使用。

你真的应该使用像DIV或P这样的“块”级元素的元素，例如：一个旨在包含多行文本（或内联元素）的文件。

正如您已经注意到的那样，您可以在SPAN中使用BR标记，这会导致换行，但内联元素在边距/填充等方面效果不佳。