代码示例：
<!DOCTYPE>
<html>
<metacharset="utf-8">
<head>
<title></title>
<styletype="text/css">
h2{color:green;}
#p1{font-family:Times,"TimesNewRoman",serif;}
#p2{font-family:Helvetica,Arial,sans-serif;}
#p3{font-family:serif;}
#p4{font-family:sans-serif;}
#p5{font-family:monospace;}
#p6{font-family:cursive;}
#p7{font-family:fantasy;}
.s1{font-style:italic;}
.s2{font-style:oblique;}
.s3{font-weight:bold;}
.s4{font-weight:100;}
.s5{font-style:normal;}
</style>
</head>
<body>
<h1>字体系列</h1>
<p>与CSS一起使用。两个常见的字体组合列表和五个通用后备字体系列。</p>
一个serif字体家族列表！
<h2>font-family:Times,"TimesNewRoman",serif</h2>
<pid="p1">
<spanclass="s1">斜体字体！</span>
<spanclass="s2">字体样式为font-style:oblique;</span>
<spanclass="s3">字体样式为font-weight:bold;</span>
<spanclass="s4">字体样式为font-weight:100;</span>
<spanclass="s5">正常字体样式！</span>
</p>
一个sans-serif字体家族列表！
<h2>font-family:Helvetica,Arial,sans-serif</h2>
<pid="p2">
<spanclass="s1">斜体字体！</span>
<spanclass="s2">字体样式为font-style:oblique;</span>
<spanclass="s3">字体样式为font-weight:bold;</span>
<spanclass="s4">字体样式为font-weight:100;</span>
<spanclass="s5">正常字体样式！</span>
</p>
serif通用字体系列！
<h2>font-family:serif</h2>
<pid="p3">
<spanclass="s1">斜体字体！</span>
<spanclass="s2">字体样式为font-style:oblique;</span>
<spanclass="s3">字体样式为font-weight:bold;</span>
<spanclass="s4">字体样式为font-weight:100;</span>
<spanclass="s5">正常字体样式！</span>
</p>
sans-serif通用字体系列！
<h2>font-family:sans-serif</h2>
<pid="p4">
<spanclass="s1">斜体字体！</span>
<spanclass="s2">字体样式为font-style:oblique;</span>
<spanclass="s3">字体样式为font-weight:bold;</span>
<spanclass="s4">字体样式为font-weight:100;</span>
<spanclass="s5">正常字体样式！</span>
</p>
等宽通用字体系列！
<h2>font-family:monospace</h2>
<pid="p5">
<spanclass="s1">斜体字体!</span>
<spanclass="s2">字体样式为font-style:oblique;</span>
<spanclass="s3">字体样式为font-weight:bold;</span>
<spanclass="s4">字体样式为font-weight:100;</span>
<spanclass="s5">正常字体样式！</span>
</p>
草书字体家族！
<h2>font-family:cursive</h2>
<pid="p6">
<spanclass="s1">斜体字体！</span>
<spanclass="s2">字体样式为font-style:oblique;</span>
<spanclass="s3">字体样式为font-weight:bold;</span>
<spanclass="s4">字体样式为font-weight:100;</span>
<spanclass="s5">正常字体样式！</span>
</p>
幻想通用字体系列！
<h2>font-family:fantasy</h2>
<pid="p7">
<spanclass="s1">斜体字体！</span>
<spanclass="s2">字体样式为font-style:oblique;</span>
<spanclass="s3">字体样式为font-weight:bold;</span>
<spanclass="s4">字体样式为Itsucksinwitha100font-weight!</span>
<spanclass="s5">正常字体样式！</span>
</p>
</body>
</html>
本文转载自中文网
本文转载自中文网
如需转载，请注明文章出处和来源网址：http://www.divcss5.com/html5/h54323.shtml
