CSS字体样式

概述
文本是网页的主要元素，CSS通过字体样式和文本样式等来设置文本的外观。 CSS中的字体样式主要包括文字的字体、大小、粗细、样式和行高。
1.字体font-family
为元素指定字体属性，按照优先级顺序，当字体1存在时，优先使用字体1；如果字体1不存在，则优先使用字体2；以此类推。字体之间用英文逗号分隔。
font字体 
	
#font_test2{
	font-family:"楷体","宋体","黑体";	
}
2.字体大小font-size
为元素指定字体大小，可以是绝对单位，最常用的是px；也可以是相对单位。
font字体 
	
#font_test3{
	font-size: 30px;
}
3.字体粗细font-weight
为元素指定字体的粗细： normal（字体为正常的字体，相当于参数为400）； bold（字体为粗体，相当于参数为700）； bolder（字体为特粗体）； lighter（字体为细体）； inherit（继承上级元素的font-weight属性设置）； 100-900（设置不同的字体粗细）
font字体 
	
#font_test4{
	font-weight: bolder;
}
4.字体样式font-style
为元素指定字体的样式，包括标准、斜体和倾斜： normal（字体为标准字体样式） italic（字体为斜体） oblique（字体为倾斜）
font字体 
	
#font_test5{
	font-style:italic;
}
5.行高line-height
为元素指定行间距，常用单位为px
font字体 
	
#font_test6{
	line-height:60px;
}
6.font综合设置字体样式
font是对字体样式进行综合设置，格式如下：选择器{font:font-style font-weight font-size/line-height font-family;} 使用font综合设置字体样式时，需要按照以上顺序书写，各个属性以空格分隔。其中不需要设置的值可以省略，但是必须保留font-size和font-family属性。
font字体 
	
#font_test7{
	font:italic bolder 30px/60px "楷体";
}
7.定义服务器字体@font-face
在网页设计中，可以使用@font-face定义服务器字体，以显示客户端未安装的字体。其语法格式如下：@font-face{font-family:字体名称;src:url(字体路径);} font-face使用方法
font字体 
	
#font_test8{
	font-family: "HappyZcool";
}
@font-face {
	font-family: "HappyZcool";
	src: url("../fonts/HappyZcool-2016.woff2") format("woff2");
}
8.图标字体
与上述服务器字体定义方式一样，使用方式略有不同。 图标字体编辑器：https://kekee000.github.io/fonteditor/
	
<!-- 使用方法1：写在html元素中，其中686是图标的编号 -->
<span class="iconfont">&#xe686;</span>
		

	
/* 使用方法1：使用css伪元素选择器，其中695是图标的编号 */
#font_test9::after{
	content:"\e695";
}
		

	
/* CSS中定义字体 */
.icon-font{
	font-family: "iconfont";
}
@font-face {
    font-family: 'iconfont';
    src: url('../fonts/iconfont.woff2') format('woff2'); /* iOS 4.1- */
}