使用 Tailwind CSS 引入小米字体告别原生自带丑字体

1.效果展示

整体效果更加圆润丝滑，看的也比较舒服，之前的微软雅黑啥的总感觉在看word文档，很不舒服

2.引入步骤

src的assets目录下新建fonts文件夹放入字体文件编写fonts.css

fonts.css内容：

@font-face {
  font-family: 'Miss Font';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('Miss_Font_1.woff2') format('woff2');
}

@font-face {
  font-family: 'Miss Font';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('Miss_Font_2.woff2') format('woff2');
}

@font-face {
  font-family: 'Miss Font';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('Miss_Font_3.woff2') format('woff2');
}

@font-face {
  font-family: 'Miss Font';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('Miss_Font_4.woff2') format('woff2');
}

@font-face {
  font-family: 'Miss Font';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('Miss_Font_5.woff2') format('woff2');
}

@font-face {
  font-family: 'Miss Font';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('Miss_Font_6.woff2') format('woff2');
}

@font-face {
  font-family: 'Miss Font';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('Miss_Font_7.woff2') format('woff2');
}

@font-face {
  font-family: 'Miss Font';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('Miss_Font_8.woff2') format('woff2');
}

@font-face {
  font-family: 'Miss Font';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('Miss_Font_9.woff2') format('woff2');
}

@font-face {
  font-family: 'Miss Font';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('Miss_Font_10.woff2') format('woff2');
}