html5 怎麼自定義字體

如何導入自己下載的字體?

首先,我們下載的字體格式一般是.ttf或者.otf,我們需要在樣式表中定義我們下載的字體,也就是在style中定義,定義的是font-family(字體族)

@font-face {
    font-family: MyFontName;//自定義字體名稱
    src: url(Mother-Tongue-Personal-Use-2.otf)//文件名
}

接下來,當我們想應用導入的字體時,比如:

dt{
	font-size:100px;
	font-family: MyNewFont;  //在這裏應用
}
dd{
	font-size:90px;
	font-family: MyNewFont; //在這裏應用
}
h3{
	font-size:120px;
	font-family: MyNewFont; //在這裏應用
	color:red;
}
<body>
		<div class="div1">
			<h3>Hello world!!!</h3>
			<dl>
				<dt>Some Words</dt>
					<dd>I love you!!!</dd>
					<dd>I love progamming!!!</dd>
					<dd>I love progamming!!!</dd>
					<dd>I love progamming!!!</dd>
					<dd>I love progamming!!!</dd>
					<dd>I love progamming!!!</dd>
					<dd>I love progamming!!!</dd>
			</dl>
		</div>
	</body>

效果如下:

在這裏插入圖片描述

關於font的詳細介紹:

在這裏插入圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章