Question

我正在尝试制作woocommerce主题，但星级评分无法正常工作。

这是显示星级的代码。

<div class="rating-custom">
  <?php wc_get_template( 'single-product/rating.php' ); ?>
</div>

这是我的CSS

.woocommerce-product-rating {
  margin-bottom: 1.618em;
  line-height: 2;
}
.woocommerce-product-rating .star-rating {
  margin: 0.5em 4px 0 0;
  float: left;
  font-family: star;
}
.woocommerce-product-rating::after, .woocommerce-product-rating .rating-custom, .woocommerce-product-rating::before {
  content: " ";
  display: table;
}
.star-rating {
  float: right;
  overflow: hidden;
  position: relative;
  height: 1em;
  line-height: 1;
  font-size: 1em;
  width: 5.4em;
  font-family: star;
}
.star-rating::before {
  content: "SSSSS";
  color: #d3ced2;
  float: left;
  top: 0;
  left: 0;
  position: absolute;
}
.star-rating span {
  overflow: hidden;
  float: left;
  top: 0;
  left: 0;
  position: absolute;
  padding-top: 1.5em;
}
.star-rating span::before {
  content: "SSSSS";
  top: 0;
  color: red;
  position: absolute;
  left: 0;
}

但是我的结果只有“ $$$”

actual result

有人可以帮助我如何按照我想要的方式进行这项工作吗？

Answer 1

在回答Obsidian Age之后，我将以下代码行添加到了span标签：font-family: 'star'

现在一切运行顺利。也请zipkundan帮忙！

Woocommerce星级评分错误

1 个答案: