　　　　　　　　　　　　　　CSS７.２１

字体样式

属性名	含义	举例
font-family	设置字体类型	font-family:\”隶书\”;
font-size	设置字体大小	font-size:12px;
font-style	设置字体风格	font-style:italic;
font-weight	设置字体的粗细	font-weight:bold;
font	在一个声明中设置所有字体属性	font:italic bold 36px \”宋体\”;

font-family属性：一般中英文混合的先写英文字体再写中文字体，一般中文字体能兼容英文字体而英文字体不兼容中文字体

font-family:\”Times，楷体\”

}

body{

font-family: Times,\”Times New Roman\”, \”楷体\”

;}

font-size属性：单位：px em rem

font-size:15px;

}

font-style属性：normal：无 italic

font-style:italic

}

font-weight属性： normal：无 bold：加粗 bolder:更粗 lighter:变细

font-weight:bold;

}

值	说明
normal	默认值，定义标准的字体
bold	粗体字体
bolder	更粗的字体
lighter	更细的字体
100、200、300、400、500、600、700、800、900	定义由细到粗的字体 400等同于normal，700等同于bold

font属性：

顺序：字体风格字体粗细字体大小字体类型

p span{

front:italic bold 12px \”楷体\”;

}

文本样式

属性	含义	举例
颜色：color	设置文本颜色	color:#00C;
对齐方式：text-align	设置元素水平对齐方式 right left center justify:两端对齐	text-align:right;
首行缩进：text-indent	设置首行文本的缩进单位 px em rem	text-indent:20px;
行高：line-height	设置文本的行高	line-height:25px;
下划线text-decoration	设置文本的装饰 none:默认值 underline：下划线 over林克：上划线 line-through 删除线	text-decoration:underline;

文本阴影

text-shadow:#ff0000 2px 3px 3px;

text-shadow : color x-offset y-offset blur-radius;

阴影颜色水平移动量垂直移动量阴影半径

超链接伪类

伪类样式：

a hover{

color:#B46210;

text-decoration:underline;

}

伪类名称	含义	示例
a:link	未单击访问时超链接样式	a:link{color:#9ef5f9;}
a:visited	单击访问后超链接样式	a:visited {color:#333;}
a:hover	鼠标悬浮其上的超链接样式	a:hover{color:#ff7300;}
a:active	鼠标单击未释放的超链接样式	a:active {color:#999;}

列表样式

l列表样式：list-style-type:

li {

list-style:none;

}

背景颜色background—color背景样式

背景图片background-image

background-image：url（图片地址）

背景重复方式：background-repeat

background-repeat属性

repeat：沿水平和垂直两个方向平铺

no-repeat：不平铺，即只显示一次

repeat-x：只沿水平方向平铺

repeat-y：只沿垂直方向平铺

背景定位 background-position属性

值	含义
Xpos Ypos	单位：px， Xpos表示水平位置，Ypos表示垂直位置
X% Y%	使用百分比表示背景的位置
X、Y方向关键词	水平方向的关键词： left、center、right 垂直方向的关键词： top、center、bottom

背景属性

background属性

background：#234324 url(图片位置) 1px 2px no-repeat

　　　　　　　背景颜色　图片　背景图片位置　背景图片排列方式

背景大小属性

background-size属性

值	含义
Xpos Ypos	单位：px， Xpos表示水平位置，Ypos表示垂直位置
X% Y%	使用百分比表示背景的位置
X、Y方向关键词	水平方向的关键词： left、center、right 垂直方向的关键词： top、center、bottom