Question

我对woocommerce产品评级有一个非常奇怪的问题。只需去看看这个产品：

http://produkti.revita.bg/shop/arnold-iron-pack-20-dozi/

并查看评论的最后一个标签。而不是显示星级评级它显示一些奇怪的事情。我已经浏览了CSS并检查了一些php文件，但我真的很困惑。

我认为这是一个CSS问题，因为实际上收视率在那里，但明星没有显示。

.woocommerce p.stars a.star-1,.woocommerce-page p.stars a.star-1 {width: 2em}

.woocommerce p.stars a.star-1:after,.woocommerce-page p.stars a.star-1:after {content: "e021"}

.woocommerce p.stars a.star-1.active:after,.woocommerce p.stars a.star-1:hover:after,.woocommerce-page p.stars a.star-1.active:after,.woocommerce-page p.stars a.star-1:hover:after {content: "e020"}

.woocommerce p.stars a.star-2,.woocommerce-page p.stars a.star-2 {width: 3em}

.woocommerce p.stars a.star-2:after,.woocommerce-page p.stars a.star-2:after {content: "e021e021"}

.woocommerce p.stars a.star-2.active:after,.woocommerce p.stars a.star-2:hover:after,.woocommerce-page p.stars a.star-2.active:after,.woocommerce-page p.stars a.star-2:hover:after {content: "e020e020"}

.woocommerce p.stars a.star-3,.woocommerce-page p.stars a.star-3 {width: 4em}

.woocommerce p.stars a.star-3:after,.woocommerce-page p.stars a.star-3:after {content: "e021e021e021"}

.woocommerce p.stars a.star-3.active:after,.woocommerce p.stars a.star-3:hover:after,.woocommerce-page p.stars a.star-3.active:after,.woocommerce-page p.stars a.star-3:hover:after {content: "e020e020e020"}

.woocommerce p.stars a.star-4,.woocommerce-page p.stars a.star-4 {width: 5em}

.woocommerce p.stars a.star-4:after,.woocommerce-page p.stars a.star-4:after {content: "e021e021e021e021"}

.woocommerce p.stars a.star-4.active:after,.woocommerce p.stars a.star-4:hover:after,.woocommerce-page p.stars a.star-4.active:after,.woocommerce-page p.stars a.star-4:hover:after {content: "e020e020e020e020"}

.woocommerce p.stars a.star-5,.woocommerce-page p.stars a.star-5 {width: 6em;border:0}

.woocommerce p.stars a.star-5:after,.woocommerce-page p.stars a.star-5:after {content: "e021e021e021e021e021"}

.woocommerce p.stars a.star-5.active:after,.woocommerce p.stars a.star-5:hover:after,.woocommerce-page p.stars a.star-5.active:after,.woocommerce-page p.stars a.star-5:hover:after {content: "e020e020e020e020e020"}

这是我在woocommerce.css中找到的这个星级评分的代码。我再次下载了woocommerce插件，并将此css块与原始块进行了比较，但它们看起来完全相同。产品允许注释，因为我已经读过这可能会导致问题。我还检查了woocommerce设置，并从那里检查所需的评级复选框。

Answer 1

您的content未被转义。 e021个实例都应该以反斜杠开头，因此它们将成为有效的CSS十六进制值。例如，对于三颗星：

content: "\e021\e021\e021";

Answer 2

在你的CSS中：

.woocommerce p.stars a.star-1:after, .woocommerce-page p.stars a.star-1:after { content: "e021"; }

将其更改为：

.woocommerce p.stars a.star-1:after, .woocommerce-page p.stars a.star-1:after { content: "\e021"; }

WooCommerce星级评分显示奇怪的符号

2 个答案: