day3小结

1、CSS：层叠样式表，用来美化网页的。做到结构（HTML）和表现（CSS）分离。
2、基本语法：
选择器{
属性：属性值；
}
3、CSS引用方式：行间样式、内部样式、外部样式、导入外部样式。
行间样式：直接在标签上书写样式。
内部样式：在文件的内部书写样式。

外部样式：（1）先创建一个CSS文件；（2）再用link标签引入这个文件。
导入外部样式：（1）先创建一个CSS文件；（2）在style标签中用import导入这个样式文件

 以上四种CSS引用方式的区别：
    行间样式只作用于当前标签；而内部样式作用于当前文件；外部样式可以被多个HTML文件引用。
    在实际项目开发中，最好使用外部样式。
    外部样式分为link引入和import引入两种方式。这两种方式区别：
        1）link是XHTML标签，除了加载CSS外，还可以定义RSS等其他事务；@import属于CSS范畴，只能加载CSS。
        2）link引用CSS时，在页面载入时同时加载；@import需要页面网页完全载入以后加载。
        3）link是XHTML标签，无兼容问题；@import是在CSS2.1提出的，低版本的浏览器不支持。
        4）link支持使用Javascript控制DOM去改变样式；而@import不支持。

4、CSS选择器分类：
1）*：匹配html中所有元素（注意：*的性能差，因为它要匹配所有元素，所以在开发时，不建议使用）
2）标签选择器：用来匹配对应的标签
3）类选择器：用来选择class命名的标签
4）ID选择器：用来选择用id命名的标签
5）派生选择器：根据上下文来确定选择的标签
6）伪类选择器（后面学）
5、选择器的分组
让多个选择器（元素）具有相同的样式，一般用于设置公共样式
6、选择器的继承
子元素可以继承父元素的样式，反之不可以
7、样式权重
!important(10000)>内联样式(1000)>id选择器(100)>类、伪类选择器(10)>标签选择器(1)

8、CSS字体
1）font-size：字号(px/%)
2）font-family：字体
3）font-style：文字样式(normal/italic/oblique)
4）font-weight：文字加粗(normal/bold/bolder/lighter/100-900)
5）line-height：行高(px/数字/em等)
6）color：文字的颜色(颜色的单词/rgb()r->0-255,g->0-255,b->0-255/16进制（以#开头，后跟6位（#rrggbb）或3位（#rgb）16进制数）)
7）text-decoration：文字修饰(none/underline/overline/line-through)
8）text-align：文本对齐方式(left/right/center)
9）text-transform：字母大小写(capitalize/uppercase/lowercase/none)
10）text-indent：文本缩进(px/em/%/pt等)

Tip:
    font复合属性：
        font:font-style font-variant font-weight font-size/line-height font-family;
        注意：
            1）属性值的位置顺序
            2）除了font-size和font-family之外，其它任何一个属性值都可以省略
            3）font-variant：normal/small-caps（让大写字母变得小一些）

9、CSS背景
1）background-color：背景色（transparent/color）
2）background-image：背景图（none/url）
3）background-repeat：背景图像铺排方式（repeat/no-repeat/repeat-x/repeat-y）
4）background-position：设置对象的背景图像位置（{x-number | top | center | bottom } {y-number | left | center | right } ）
5）background-attachment：背景图像滚动位置（scroll/fixed）
6）background：设置背景的复合写法
background: color image repeat attachment position
10、CSS伪类选择器
伪类：专门用来表示元素的一种特殊状态。
常用伪类选择器：
1）a标签的伪类：
:link/:visited/:hover/:active
2）:focus 获得焦点
3）：first-child/:last-child/:nth-child(number)
11、属性选择器
[属性名]:包含有指定属性名的元素（常用）
[属性名=值]:属性名的值为指定值的元素（常用）
[属性名~=值]:属性名的值包含指定值的元素
[属性名^=值]:属性名的值以指定值开头的元素
[属性名$=值]:属性名的值以指定值结尾的元素
12、关系选择器
1）空格：后代选择器
2）>：只选择儿子元素
3）+：兄弟选择
13、CSS伪元素
CSS伪元素与伪类区别：

晕3DDDDD