CSS
Cassading Style Sheet,层叠样式表。主要功能是实现内容与样式分离.
一、引入
1.行内样式
<span style="propName:propValue"></span>
2.内部样式
<head>
<style type="text/css">
css body
</style>
</head>
3.外部样式
<link type="text/css" rel="stylesheet" href="xx.css">
二、选择器
1.标签选择器
标签为html标签
标签名{
propName:propValue;
}
2.类选择器
类名通过标签的class属性引入
.类名{
propName:propValue;
}
3.id选择器
id通过标签的id属性引入(标签间的id不可重)
#id{
propName:propValue;
}
4.高级选择器
4.1伪类选择器
a:link{}
a:visited{}
a:hover{}
a:active{}
4.2选择符分组
对E1,E2,E3应用同一规则
E1,E2,E3{sRules}
4.3子对象选择器
E2是E1的子对象
E1>E2{sRules}
4.4包含选择器
对所有被E1包含的E2
E1 E2{sRules}
4.5通配符选择器
对所有标签应用同一规则
*{sRules}
三、样式的覆盖
行内样式覆盖——>id选择器覆盖——>类选择器覆盖——>标签选择器
四、盒模型
默认body会有上下的8px的外边距
- Margin
- Border
- Padding
- Content
四、div和span
- div
- 定义文档中的分区(division)
- 使用class或id来标记
- 块级元素
span
组合文档中的行内元素