Question

因此，自我启动此网站（https://shop.cafedumonde.com/）以来，我一直遇到此问题。每当我单击“添加到购物车”按钮时，按钮都会展开，并且“字体真棒”中的向右箭头图标会出现。它从来没有做过，我尝试了各种方法使其正常工作，但无济于事。这是我正在使用的代码。首先是HTML：

<div class="wp-block-button wc-block-grid__product-add-to-cart">
    <a href="?add-to-cart=46198" aria-label="Add &ldquo;Beignet Mix&rdquo; to your cart" data-quantity="1" data-product_id="46198" data-product_sku="R2A" rel="nofollow" class="wp-block-button__link add_to_cart_button ajax_add_to_cart">Add to cart</a>
 </div>

CSS：

.wc-block-grid__product-add-to-cart a.added::after {
    color: #fff;
    content: '\f0a9';
    font-family: "Font Awesome 5 Free";
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
}

Answer 1

在可以向购物车中添加商品的页面上，我似乎在任何地方都找不到此类：wc-block-grid__product-add-to-cart-这很可能是您遇到问题的原因（除非我没有看清楚页面，在这种情况下，您能告诉我应该浏览哪个页面？）

编辑：问题是Font Awesome正在使用图标作为字体。加载字体时，您需要显式加载您正在使用的粗细。在您的情况下，损坏它的问题是font-weight: normal;属性-删除它，您的图标应该可以工作了:)

真棒字体：为什么我的箭头图标没有加载到：after实例上？

1 个答案: