css多字体文件的引入和使用

新建一个font.css文件

font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中

@font-face {
  /* 重命名字体 */
  font-family: 'YSBTH';
  /* 引入字体 */
  src: url('./YouSheBiaoTiHei.ttf');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  /* 重命名字体 */
  font-family: 'PangMenZhengDao';
  /* 引入字体 */
  src: url('./PangMenZhengDaoBiaoTiTi.ttf');
  font-weight: normal;
  font-style: normal;
}

使用字体文件

如果是vue项目直接在main.js 中引入就可以

import './assets/fonts/font.css'

html 中使用

.demo{
    font-family: PangMenZhengDao;
}

你可能感兴趣的:(css)