<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>在页面上显示服务器端的字体</title>
<style>
@font-face{ font-family:webfont; src:url(font/qtgg.otf);}
@font-face{ font-family:Arial; src:local('Arial');}
h1{ font-family:webfont;}
h2{
font-family:Arial;
font-weight:lighter;
font-size: 10px;
}
h2.bold{
font-weight:bold;
font-size:30px;
}
h2.bolder{
font-weight:bolder;
font-size:50px;
}
</style>
</head>
<body>
<h1>在页面上显示服务器端的字体</h1>
<h1>Hello Html5 Css3</h1>
<h2 class=" bold">Hello Html5 Css3</h2>
<h2 class=" bolder">Hello Html5 Css3</h2>
</body>
</html>
效果图：