使用CSS内容添加HTML实体

Question

使用CSS内容添加HTML实体如何使用css？content属性来添加html实体？用这样的东西只是打印 到屏幕上，而不是不间断的空间：.breadcrumbs a:before {     content: ' ';}

Answer 1

CSS不是HTML。 是一个名为字符引用在HTML中；等效于十进制数字字符引用 ..160是小数。码点.的.NO-BREAK SPACE字Unicode(或UCS-2；见HTML4.01规范)。该代码点的十六进制表示为U+00A0(160=10×16)。¹ + 0 × 16⁰)。你会发现在Unicode中代码图和字符数据库.

在CSS中，您需要对这些字符使用Unicode转义序列，它基于字符代码点的十六进制值。所以你需要写

.breadcrumbs a:before {
  content: '\a0';}

只要转义序列在字符串值中最后出现，这就可以工作。如果字符跟随，有两种方法可以避免误解：

(其他人提到)在转义序列中使用确切的六个十六进制数字：

.breadcrumbs a:before {
  content: '\0000a0foo';}

b)在转义序列之后添加一个空白字符(例如空格)：

.breadcrumbs a:before {
  content: '\a0 foo';}

(自f是十六进制数字，\a0f否则就意味着GURMUKHI LETTER EE如果您有合适的字体，请使用ਏ)。)

分隔空格将被忽略，这将被显示。 foo，这里显示的空间将是NO-BREAK SPACE性格。

空域法('\a0 foo')与六位数法相比有以下优点('\0000a0foo'):

• 它是

  更容易打字

  ，因为前导零是不必要的，数字不需要计算；
• 它是

  易读

  ，因为转义序列和后面的文本之间有空白，不需要计算数字；
• 它

  需要更少的空间

  ，因为前导零是不必要的；
• 它是

  向上兼容

  ，因为Unicode在将来支持超过U+10FFFF的代码点将需要修改CSS规范。

因此，若要在转义字符之后显示空格，请使用二样式表中的空格-

.breadcrumbs a:before {
  content: '\a0  foo';}

-或明文规定：

.breadcrumbs a:before {
  content: '\a0\20 foo';}

看见CSS 2.1，“4.1.3字符和案例”一节关于细节。

Answer 2

点对点提到了正确的立场 在所有CSS情况下
'\a0 '这意味着空格是十六进制字符串的终止符，并被转义序列吸收。他进一步指出权威描述这听起来是我在下面描述和修正的问题的一个很好的解决方案。

您需要做的是使用转义的Unicode。尽管有人告诉你\00a0不是一个完美的替身 在CSS中；所以尝试：

content:'>\a0 ';          /* or */content:'>\0000a0';       /* because you'll find: */content:'No\a0 Break';    /* and */content:'No\0000a0Break'; /* becomes No Break as opposed to below */

专用\0000a0如 ..如果您按照Mathieu和Millikin的建议尝试：

content:'No\00a0Break'   /* becomes No਋reak */

它把B变成了妖术的转义字符。同样的情况发生在0-9a-FA-F.