使用CSS内容添加HTML实体

如何使用CSS内容属性来添加HTML实体?

使用像这样的东西只是打印 返回到屏幕上，而不是不间断的空格:

.breadcrumbs a:before {
  content: '&nbsp;';
}

当前回答

我知道这是一个相当老的帖子，但如果间距是你所追求的，为什么不简单地:

.breadcrumbs a::before {
  content: '>';
  margin-left: 8px;
  margin-right: 8px;
}

我以前用过这种方法。在我的测试中，它完全可以与“>”并排的其他行自动换行。

其他回答

你必须使用转义的unicode:

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

更多信息:http://www.evotech.net/blog/2007/04/named-html-entities-in-numeric-order/

我知道这是一个相当老的帖子，但如果间距是你所追求的，为什么不简单地:

.breadcrumbs a::before {
  content: '>';
  margin-left: 8px;
  margin-right: 8px;
}

我以前用过这种方法。在我的测试中，它完全可以与“>”并排的其他行自动换行。

使用十六进制代码表示不间断的空格。就像这样:

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

CSS不是HTML。,是HTML中的命名字符引用;等价于十进制数字字符引用 。160是Unicode(或UCS-2;参见HTML 4.01规范)。该码位的十六进制表示为U+00A0 (160 = 10 × 161 +0 × 160)。你可以在Unicode代码图表和字符数据库中找到。

在CSS中，你需要为这样的字符使用Unicode转义序列，它是基于字符码位的十六进制值。所以你需要写

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

只要转义序列位于字符串值的最后，这就可以工作。如果后面跟着字符，有两种方法可以避免误解:

a)(其他人提到的)使用恰好6个十六进制数字作为转义序列:

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

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

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

(因为f是一个十六进制数字，\a0f在这里代表GURMUKHI字母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字符和大小写”章节。

在CSS中，你需要使用Unicode转义序列来代替HTML实体。这是基于一个字符的十六进制值。

我发现将符号转换为其十六进制等值的最简单方法是，例如从\ \(▾)到\25BE是使用微软计算器=)

是的。启用程序员模式，打开十进制，输入9662，然后切换到十六进制，你会得到25BE。然后在开头加一个反斜杠\。

推荐文章