为什么我在开启之后不能使用空格:之前:使用unicode之后的内容

Question

我只是想知道为什么在CSS中使用unicode时我不能在 unicode 之后放置空格 :

这是我的测试:

div {font-size:50px;}
div:before, div:after {color:green;}
.a:before {content: 'text-before \2022 ';}
.b:before {content: 'text-before • ';}
.c:after {content: ' \2022 text-after';}
.d:after {content: ' • text-after';}

<div class="a">A-Hello</div>
<div class="b">B-Hello</div>
<div class="c">C-Hello</div>
<div class="d">D-Hello</div>

---

所以你会看到B并D使用非unicode允许在char之后添加空格.但是当使用unicode(A和C)空格时就消失了.

.x:before {content: '\2022 ';}

<div class="x">Hello</div>

所以问题是:为什么以及如何在uncicode之后添加真正的空间字符(因为我们在键盘上按下空格键)？(不使用边距填充)

Answer 1

该空间作为转义序列的一部分被消耗,以防止其他十六进制字符被误解为转义序列的一部分.从规格:

如果[0-9a-fA-F]范围内的字符跟随十六进制数字,则需要清除数字的结尾.有两种方法可以做到这一点:

1. 带空格(或其他空白字符):"\ 26 B"("&B").在这种情况下,用户代理应将"CR/LF"对(U + 000D/U + 000A)视为单个空格字符.
2. 通过提供正好6个十六进制数字:"\ 000026B"("&B")

例如,空格有助于区分字符串'\2022 ff'和字符串'\2022ff',这意味着完全不同(我甚至不确定它代表一个真正的字符).

要在特殊字符后添加空格,请添加另一个空格字符:

.x:before {content: '\2022  ';}

<div class="x">Hello</div>