在某些模板中，我看到一个用 CSS 创建的箭头。像这样的东西：
div:after{
content:"\f107";
}
此代码显示如下箭头：
这个代码是什么？在哪里可以找到更多代码？
问问题
11937 次
5 回答
5
这是一个转义的 unicode 字符。
于 2013-11-26T07:04:58.990 回答
5
使用content属性将虚拟内容嵌入到元素中，它与伪:beforeor一起:after使用，因此如果使用:before，内容将被嵌入之前。
来自MDN：
contentCSS 属性与::before和::after伪元素一起用于在元素中生成内容。content使用该属性插入的对象是匿名 替换元素。
内容属性可以包含任何字符、数字、实体。有关更多信息，您可以在此处参考文章。
此外，您可以在这里获得一个方便的转换器。
此方法也被font-awesome - Example和其他相关的 svg 字体嵌入库使用，您可以在其中简单地调用元素的类，字体将被虚拟嵌入。
此外，只是一个侧面信息，默认情况下使用 CSScontent属性生成的内容inline，这也是在元素内部而不是外部呈现的。
于 2013-11-26T07:05:18.440 回答
3
As other answers have explained, the CSS rule uses the content property to insert a character by its Unicode number.
However, the character used is U+F107 PRIVATE USE CHARACTER-F107. This means that it has no meaning except by private agreements and should not be used in public information interchange. Unfortunately, some “awesome” tricks use Private Use code points to insert graphic symbols. This means that unless a very specific font, with some symbols assigned to those code points is used, a generic symbol of an unknown character appears.
So it is much safer to use an image instead, in the content proper.
于 2013-11-26T09:25:56.583 回答
1
CSS 有一个名为content. 它只能与伪元素:after和:before. 它写得像一个伪选择器（带有冒号），但它被称为伪元素，因为它实际上并没有选择页面上存在的任何东西，而是向页面添加新的东西。
Font Awesome 是一种网络字体，包含来自 Twitter Bootstrap 框架的所有图标，现在还有更多。
您可以在FontAwesome此处找到列表：Font Awesome 图标及其 CSS 内容值列表
您也可以通过此链接FontAwesome Examples，您可以在其中看到不同的图标以及如何在其上应用不同的大小。
于 2016-10-25T06:22:34.433 回答
0
CSS Content Property : The content property is used with the :before and :after pseudo-elements, to insert generated content.
于 2013-11-26T07:23:53.167 回答