Question

我有以下CSS：

.rating:not(:checked) > label:before {
  content: '★';
}

在渲染时，我会看到★而不是â˜。如果我使用Firebug并将内容更改为★，则显示正确。

会发生什么？我该如何解决？

由于

Answer 1

您的CSS和HTML文件的文本编码（字符集）可能不一致。

要设置样式表的编码，请使用@charset;例如：

@charset "UTF-8";

要设置HTML网页的编码，请使用<meta>标记（位于顶部的<head>部分）;例如：

<meta http-equiv="Content-type" content="text/html;charset=utf-8">

或在HTML 5中：

<meta charset="UTF-8">

样式表的@charset必须同意为其HTML页面选择的编码。

Answer 2

原因是BLACK STAR“★”（U + 2605）在包含CSS代码的源中显示为UTF-8编码，但该源被解释为ISO-8859-1编码。修复程序取决于CSS代码的位置，服务器软件等。

Answer 3

在slick-theme.css文件中，我有：@charset 'UTF-8'，单引号标记了问题所在，我将它们更改为双引号，例如：@charset "UTF-8"。而且有效

Answer 4

您也可以在其十六进制值中指定它，而无需添加字符编码声明。

代替：

content: '★';

应该是：

content: '\2605';

你可以在这里查看：