CSS引入外部字体
第一步，在 CSS 中引入字体并给字体取一个合适的名字，如下：
<style type="text/css">
/* 引入外部字体 */
@font-face {
font-family:"新叶念体"; /* 定义字体名字 */
src:url(font/新叶念体.otf),
url(font/新叶念体.eot); /* IE9 */src是加载字体文件的位置，之所有有多个url就是因为浏览器兼容问题，字体后缀和浏览器有关，如下：
* .TTF或 .OTF，适用于 Firefox 3.5、Safari、Opera
* .EOT，适用于 Internet Explorer 4.0+
* .SVG，适用于 Chrome、IPhone
第二步，使用刚刚定义的字体，如下：
p{
font-family: "新叶念体";
}
完整代码及效果：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>外部字体</title>
<style type="text/css">
/* 引入外部字体 */
@font-face {
font-family:"新叶念体"; /* 定义字体名字 */
src:url(font/新叶念体.otf),
url(font/新叶念体.eot); /* IE9 */
}
p{
font-family: "新叶念体";
font-size: 40px;
}
</style>
</head>
<body>
<p>This is 外部字体新叶念体</p>
</body>
</html>
1277
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
