现在主要设置的字体样式种类有以下五种
1、font-style：指定文本字体样式
itailc：指定为斜体
oblique：对于没有设计过斜体样式的文字强行用代码使其倾斜
2、font-variant：指定文本是否为小型的大写字母（只对字母有效）
small-cap：小型的大写字母
3、font-weight：指定文本字体的粗细
bold：粗体400
4、font-size：指定文本字体尺寸
xx-small/x-small/small/medium/large/x-large/xx-large/smaller/large
length类型
em/ex/ch/rem/vw/vh/vmax/vmin/cm/mm/q/in/pt/pc/px
percentage 百分比形式
number 数值形式
5、font-stretch：指定文字宽窄，没什么效果
html文件
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>Document</title> <link rel="stylesheet" href="css/1.css" /> </head> <h3>font-style样式：指定文字字体样式</h3> <span>正常文字</span> <br /> <span class="italic">指定文本样式为斜体</span> <br /> <span class="oblique">对于原来的字体没有斜体的样式的字体设置斜体</span> <h3>font-varint（变种）样式：指定文本字母是否为小型的大写字母</h3> <span class="small-cap">xiaoxingdedaxiezimu</span> <h3>font-weight样式：指定文本字体粗细</h3> <span class="bold">粗体的文字400</span> <h3>font-size样式：指定文字尺寸</h3> <span class="xx-small">xx-smmall字体</span> <span class="xx-large">xx-large</span> <br /> <span class="length"><p>em ex ch rem vw vh vmax vmin cm mm q in pt px pc</p></span> <br /> <span class="percentage">百分比形式</span> <br /> <span class="number">number形式</span> <h3>font-family：指定文本使用哪种字体</h3> <span class="famliy">使用楷体文字</span> <h3>font-stretch：指定文本伸展</h3> <span class="stretch">文字宽度凤凰飞京哈</span> </body> </html>
</pre><p></p><p>css文件</p><p><pre name="code" class="css">.italic{
font-style:italic;
}
.oblique{
font-style:oblique;
}
.small-cap{
font-variant:small-caps;
}
.bold{
font-weight:bold;
}
.xx-small{
font-weight:xx-small;
}
.xx-large{
font-size:xx-large;
}
.length{
font-size:2em;
}
.percentage{
font-size: 200%;
}
.number{
font-size:0.58;
}
.famliy{
font-family:"楷体";
}
.stretch{
font-stretch:ultra-expanded;
}
时间： 2024-11-10 06:59:20