uniapp设置宋体字

在UniApp中设置宋体字

UniApp默认使用的是系统字体，若需全局或局部设置为宋体，可通过以下方式实现：

全局设置宋体

在App.vue的style标签中定义全局样式：

page {
  font-family: "SimSun", "宋体", serif;
}

局部组件设置宋体

在具体组件的style标签中设置：

.custom-font {
  font-family: "SimSun", "宋体", serif;
}

注意事项

1. 字体名称兼容性：不同平台对字体名称的解析可能不同，建议同时指定中英文名称（如"SimSun", "宋体"）。

2. 动态加载字体：如需确保移动端显示效果，可通过以下代码动态加载网络字体（需替换实际字体URL）：

   

   @font-face {
   font-family: 'CustomSimSun';
   src: url('https://example.com/fonts/SimSun.ttf') format('truetype');
   }

3. 平台差异：

   • 微信小程序：需将字体文件放在项目根目录下，并通过@font-face引用本地路径。
   • H5：支持直接使用系统字体或网络字体。

4. 性能优化：中文字体文件较大，建议仅在必要场景使用，避免影响页面加载速度。