harmony 鸿蒙Custom Font Styles

Custom Font Styles

The custom font can be loaded from the font file in a project. The font file must be in .ttf or .otf format.

NOTE

This component is supported since API version 4. Updates will be marked with a superscript to indicate their earliest API version.

@font-face {   
  font-family: font; 
  src: url('/common/font.ttf'); 
}

font-family

Customize a font.

src

Supported sources of custom fonts:

Font file in the project: Specify the absolute path of the font file in the project through url. For details, see File Access Rules.
You can set only one src attribute.

You can set font-face in style and specify the name of the font-face using font-family.

Example

Page layout:

<!-- xxx.hml -->
<div>    
  <text class="demo-text">Test the custom font.</text>  
</div>

Page style:

/*xxx.css*/
@font-face {
  font-family: font;
  src: url("/common/font.ttf");
}
.demo-text {
  font-family: font;
}

0 赞

所属分类： 后端技术
本文标签：
版权声明： 原创文章如转载，请注明本文链接: https://www.seaxiang.com/blog/c423271871284d14a4df72da8bd260ec