最初字体模糊然后恢复正常

如何解决最初字体模糊然后恢复正常

所以最后我用 SCSS 创建了一个页面。但我遇到了问题。 我创建了这张卡并添加了 scss。最初，我收到这样的文本。但几秒钟后，它又回到了我需要的状态。我在 head 标签中使用了谷歌字体链接，也使用了 scss 中的导入。但结果是一样的。这仅发生在卡片内的文本中。 所以这是我的 SCSS

.blogs {
  .card-heading {
    font-size: 1.3rem;
    color: $card-head-color;
    font-weight: 500;
  }
  p.card-content {
    color: $secondary-color;
    margin-bottom: 0;
  }
  .card-body {
    Box-shadow: 0px 0px 22px 0px #e0e0e0;
    background: #ffffff00;
    backdrop-filter: blur(8px);
    border: #ffffff;
    border-radius: 10px;
    padding: 1.25rem;
  }
}

<div class="blogs">
<div class="card card-body mb-3 p-1">
              <div class="row">
                <div class="col-4">
                  <img
                    src="https://www.visa.co.in/dam/VCOM/regional/ap/india/global-elements/images/in-visa-gold-card-498x280.png"
                    class="p-2 rounded"
                    style="height: 60px; width: 70px !important"
                    alt=""
                  />
                </div>
                <div class="col-md-8 pl-0">
                  <small
                    class="text-black text-truncate-3 mb-0 p-col"
                    style="font-weight: 500"
                  >
                    heading of the blog. It Could be anything. It needs to be
                    inside this Box.
                  </small>
                </div>
              </div>
            </div>
            </div>

解决方法

你试过流畅的字体吗？

<script src="https://d3js.org/d3.v3.min.js"></script>