# 自定义字体样式
自定义字体可以是从项目中的字体文件中加载的字体,字体格式支持ttf和otf。
说明:
从API version 4开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
# 定义font-face
@font-face {
font-family: HWfont;
src: url('/common/HWfont.ttf');
}
1
2
3
4
2
3
4
font-family:
自定义字体的名称。
src:
自定义字体的来源,支持如下类别:
项目中的字体文件:通过url指定项目中的字体文件路径(只支持绝对路径,详见资源和文件访问规则章节)。
不支持设置多个src。
# 使用font-face
可以在style中定义font-face,然后在font-family样式中指定该font-face的名称,从而应用font-face定义的字体。
示例:
页面布局:
<!-- xxx.mxl -->
<div>
<text class="demo-text">测试自定义字体</text>
</div>
1
2
3
4
2
3
4
页面样式:
/*xxx.css*/
@font-face {
font-family: HWfont;
src: url("/common/HWfont.ttf");
}
.demo-text {
font-family: HWfont;
}
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8