Cascading Style Sheets 层叠样式表
一、基本样式：
内联：<span style="color:red;font-size:10px;" >text</span>
嵌入：<style type="text/css">span{color:red;font-size:10px;}</style>
外部：<link href="style.css" rel="stylesheet" type="text/css">
适用情况
内联式:局部特殊化
嵌入式:统一标签样式格式
外联式:方便代码重用和管理
rel是relationship的英文缩写
stylesheet中style是样式的意思,sheet是表格之意,总起来是样式表的意思
rel="stylesheet" 描述了当前页面与href所指定文档的关系.即说明的是,href连接的文档是一个新式表
二、选择器：
1.标签选择器
2.类选择器:
.setGreen{color:green;}
<span class=“setGreen”>text</span>
3.id选择器：
#setGreen…
同一页面头体脚只出现一次，用id
class可以并列使用，id不行
4.子选择器：
> 选择指定标签元素的第一代子元素
.first>span{color:red;
}
5.包含(后代)选择器
空格
6.通用选择器：
* 匹配所有标签
7.伪选择器：
a:hover{color:red;}
8.分组选择器：
.first,#second span{color:green;}
三、特性
1.继承性：color可继承，border不可继承
2.特殊性：权值：
标签：1
类：10
id：100
3.层叠：权值一样时就近原则
4.重要性：!important
区分：
继承是指标签的样式可以由子代继承，但有些标签是不能继承的，eg：border。
特殊性指用用权重来确定最后起作用的样式，id=100，class=10，标签=1，继承=0.1；
层叠指当权重相同时，后面的样式覆盖前面的样式。
四、排版：
字体：body{font-family:"Microsoft Yahei";}
字号颜色：body{font-size:12px;color:#666}
粗体，斜体
文本修饰：underline,overline,line-through,blink
缩进：1em=16px(浏览器默认字体高度)
行间距，字间距
五、盒模型
元素分类：
块状元素都自带换行效果；
内联元素都是定义行内小区域且不换行，但如果没有内容就没有意义，不占空间；
内联块状元素除了不换行，即使没有内容也会占空间。
转换：
转为块状：a{display:block;}
转为内联：div{display:inline}
边框、宽高、填充、边界