1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <link rel="stylesheet" type="text/css" href="style.css"> 7 <style type="text/css"> 8 #p1{font-size: 50px} 9 #p2{font-size: 200%} 10 #p3{font-size: 2em} 11 #p4{font-size: xx-small;} 12 #p5{font-size: x-small;} 13 #p6{font-size: small;} 14 #p7{font-size: medium;} 15 #p8{font-size: large;} 16 #p9{font-size: x-large;} 17 #p10{font-size: xx-large;} 18 #p11{font-size: smaller;} 19 #p12{font-size: larger;} 20 #p13{font-variant: normal; } 21 #p14{font-variant: small-caps; } 22 #p15{font-style: normal;} 23 #p16{font-style: italic;} 24 #p17{font-style: oblique;} 25 #p18{font-weight: normal;} 26 #p19{font-weight: bold;} 27 #p20{font-weight: bolder;} 28 #p21{font-weight: lighter;} 29 #p22{font-weight: 700;} 30 #p23{font-weight: 900;} 31 #p24{font-family: 隶书,楷体} 32 #p25{font: 30px 隶书 } 33 </style><!--font-family可设置多个内容，用逗号隔开，若无第一个则匹配第二个以此类推。--> 34 </head> 35 <body> 36 <div> 37 <p>未设置字体</p> 38 <p id="p1">font-size规定文本的字体尺寸</p> 39 <p id="p2">font-size规定文本的字体尺寸</p> 40 <p id="p3">font-size规定文本的字体尺寸</p> 41 <p id="p4">font-size规定文本的字体尺寸</p> 42 <p id="p5">font-size规定文本的字体尺寸</p> 43 <p id="p6">font-size规定文本的字体尺寸</p> 44 <p id="p7">font-size规定文本的字体尺寸</p> 45 <p id="p8">font-size规定文本的字体尺寸</p> 46 <p id="p9">font-size规定文本的字体尺寸</p> 47 <p id="p10">font-size规定文本的字体尺寸</p> 48 <p id="p11">font-size规定文本的字体尺寸</p> 49 <p id="p12">font-size规定文本的字体尺寸</p> 50 <p id="p13">font-variant规定是否以小型大写字母的字体显示文本,normal默认值，浏览器会显示一个标准字体</p> 51 <p id="p14">font-variant规定是否以小型大写字母的字体显示文本，浏览器会显示小型大写字母的字体</p> 52 <p id="p15">font-style规定文本的字体样式，normal默认值，浏览器会显示一个标准字体</p> 53 <p id="p16">font-style规定文本的字体样式，italic浏览器会显示一个斜体的字体样式，类似i标签的作用</p> 54 <p id="p17">font-style规定文本的字体样式，oblique浏览器会显示一个倾斜的字体样式</p> 55 <p id="p18">font-weight规定字体的粗细，normal默认值，标准粗细。类似b标签的作用</p> 56 <p id="p19">font-weight规定字体的粗细，bold粗体</p> 57 <p id="p20">font-weight规定字体的粗细，bolder更粗</p> 58 <p id="p21">font-weight规定字体的粗细，lighter更细</p> 59 <p id="p22">font-weight规定字体的粗细，100-900,400等同normal，700等同bold</p> 60 <p id="p23">font-weight规定字体的粗细，100-900,400等同normal，700等同bold</p> 61 <p id="p24">font-family规定字体系列，如楷体、隶书等</p> 62 <p id="p25">font可同时设置字体多种属性，至少要设置字体大小font-size(位置倒数第二）和字体系统font-family(位置最后），font-style、font-variant、font-weight放在前面顺序随便。</p> 63 <p id="p26">font-face我的自定义字体</p> 64 </div> 65 </body> 66 </html>
1 @font-face{ 2 font-family: "myfont"; 3 src:url('fonts/FZMWFont.ttf'); 4 } 5 #p26{font-size:40px;font-family: myfont}