引入ttf類型的字體不起作用的解決方法

前端引入一種後綴名爲.ttf的字體,並在css文件中設置該字體,但是頁面中並沒有顯示新引入的字體:

@font-face {
    font-family: 'myFont';
    src: url('./my-font.ttf') format('ttf');
    font-weight: 600;
    font-style: normal;
}

.my-font {
    font-family: 'myFont';
    color: red;
}

原因:後綴名爲.ttf的字體的format()不是ttf,而是 truetype,改成如下就行了:

@font-face {
    font-family: 'myFont';
    src: url('./my-font.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

.my-font {
    font-family: 'myFont';
    color: red;
}
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章