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的详细介绍:

在这里插入图片描述

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