0

我想在 BR 标签之后添加一个 em-space 以实现文本缩进效果。但以下 STYLE 不适用于我的 Chrome。

或者,还有什么其他方法可以在 BR 标签之后实现文本缩进效果?

<style>
br::after { 
  content: "&emsp;";
}
</style>

<p>Note:<br>For this selector to work in IE8, a DOCTYPE must be declared, and you must use the old, single-colon CSS2 syntax (:after instead of ::after).</p>
4

2 回答 2

1

你真的不应该使用换行符 (br) 标签来分割段落,而不是在现代网页设计中。有关示例,请参阅HTML 5.2 规范

此外,还有一个 CSS 属性text-indent也可以实现您所追求的文本缩进。

基本上,<p>按预期使用(例如,换行)然后应用于text-indent标签p

p {
  text-indent: 1em;
}
p.unindented {
  text-indent: inherit;
}
<p class="unindented">Note:</p>
<p>For this selector to work in IE8, a DOCTYPE must be declared, and you must use the old, single-colon CSS2 syntax (:after instead of ::after).</p>
<p>Here is another paragraph to show how this applies when you have more than one &lt;p&gt; of content. The text-indent property is supported by all major browsers. (That is, IE 3 and later. Not that IE is a major browser anymore....)</p>
<p>See here for more info: https://developer.mozilla.org/en-US/docs/Web/CSS/text-indent</p>

text-indent是一个非常古老的属性,在所有主要浏览器和许多旧浏览器中都有广泛的支持。它最初是在 IE 3 中引入的,以了解它的历史。有关更多信息,请参阅MDN

于 2019-09-25T01:55:44.583 回答
0

我设法做到这一点,在 BR 标签之后添加一个 em 空间!

<style>
br {
  content: '';
  white-space: pre;
}

br::after { 
  content: "\A\2003";
}
</style>

另一个问题是我还想保持 1em 的边距底部。以下样式 ALONE 效果很好。

<style>
br {
  content: '';
  display: block; 
  margin-bottom: 1em; 
}
</style>

但是,如果我将这两种样式混合到下面,它就行不通了!!!

<style>
br {
  content: '';
  white-space: pre;
  display: block; 
  margin-bottom: 1em; 
}

br::after { 
  content: "\A\2003";
}
</style>
于 2019-09-25T01:25:14.020 回答