1. css的概念及其作用
css全称为（Cascading Style Sheets）翻译过来就是层叠样式表。
作用：主要作用就是设置网页的文字（大小，颜色，字体，对齐等等）图片和板式布局等等，其实说的简单点了就是给页面化妆的。
基本语法
选择器 {
属性1: 值1;
属性2: 值2;
...
}CSS初体验
修改字体的颜色和字体大小，通过标签div选择器设置。
Title
CSS入门初体验
构建css的运行环境是通过style标签，该标签可以写在任意位置，但通常写在head标签里面。而在style标签里选中对应的元素，如div，div标签后面跟一个空格，然后在大括号中以健值对的方式写属性和属性值。
2. 字体属性
2.1 设置字体的大小
font-size 设置字体的大小
取值：font-size: 30px;
注意：在css大多数数值都需要添加单位，px是一个单位像素，代表屏幕的像素通过标签选择器设置字体的大小
设置字体的大小
2.2 设置字体的粗细
font-weight 设置字体的粗细
取值：normal（普通字体）、bold（加粗字体）、100-900注意：用数字设置的时候，只有400和700会产生变化，是因为字体在初始设计的时候就没有设置太多的粗细标准，一般就是两种，默认的和加粗的，所以在实际工作中，用的最多的就是normal（400） bold（700）
通过标签选择器设置字体的粗细
设置字体的粗细
2.3 设置字体的风格
font-style 设置字体的风格（样式）
取值：normal 默认，显示标准字体样式
italic 字体斜体通过标签选择器设置字体的风格（样式）
设置字体的风格(样式)
2.4 设置不同类型的字体
font-family 设置不同类型的字体
取值：宋体、微软雅黑、黑体等注意：
- 不推荐使用一些冷门字体，因为一些冷门字体很多电脑里面默认没有安装，这个时候就会显示不出来。所以实际工作中，默认都是一些主流字体 如宋体 微软雅黑 等
- 字体可以写多组，中间用逗号隔开；如：font-family: '微软雅黑', Arial;
- 字体名称中如果有空格 # $ 这种特殊字符的时候需要添加上引号，中文字体也需要添加引号。了解：http://code.ciaoca.com/style/...
2.5 font简写
font: font-style font-weight font-size/line-height font-family;
不建议修改顺序，并且不需要设置的属性可以不写，但是font-size和font-family必须指定，否则将不起作用font简写设置字体
font的简写
3 选择器
想要操作任何一个标签，那么首先需要做的事情就是选中对应的标签，而这个就是选择器的作用
3.1 标签选择器
标签名 {
属性1: 值1;
属性2: 值2;
...
}特点：会将页面上所有符合的标签都选择上，但是不能实现差异化选择。
使用标签选择器，如示例中的div标签，所有的div标签都会应用上css样式。
标签选择器
标签选择器
3.2 类名选择器
- 声明类名选择器: 声明自定义类名 .自定义类名 {属性1:值1;属性2: 值2;}
- 调用类名选择器: 给对应的元素添加class类名属性 class="自定义的类名"
类选择器
特点：可以给相同标签的元素定义不同的样式，在实际工作中用的最多
类选择器
类选择器
3.3 多类名选择器
需求：两个相同的标签，有一些共同的css样式 但是也有一些差异化的css样式，怎么实现呢？
如：字体的颜色相同，但字体的大小不一样
类选择器
类选择器
一个元素可以拥有多个类名，类名和类名之间用空格隔开，多类名选择器可以让我们解决更复杂的一些需求。
3.4 id选择器
id选择器的使用方式和类选择器基本一致：
- 声明id方式： #自定义id名字 {属性1:值1;属性2:值2;}
- 调用id方式： 给对应的元素添加属性 id="自定义id"
id选择器
特点：id选择器一般配合后期的js使用较多，效果和类选择器一样，只不过是类选择器可以被多个元素调用，但是id选择器只能被一个元素调用 在同一个页面中，不能出现两个id值相同的元素
3.5 通配符选择器
* {
属性1: 值1;
属性2：值2;
}特点：选中任何元素，后期用于页面初始化。
3.6 伪类选择器
伪类选择器可以理解为选择的元素的一种状态，并不是如之前直接选中元素就完事了。
如：a标签的伪类选择器
a:link 没有被访问的时候的状态
a:visited 访问之后的状态
a:hover 鼠标移动上去之后的状态
a:active 鼠标按下的状态伪类选择器在实际工作中，不会写这么多，意义不大，推荐简写的方式完成
a {}
a:hover {} 鼠标移动上去之后的状态4 文字的对齐、缩进、下划线
4.1 水平对齐
通过text-align属性设置，如：text-align:值;
取值：left 左对齐方式
right 右对齐方式
center 居中对齐方式
注意：该属性控制的是标签 “内部的文字” 水平居中
文字水平对齐
4.2 首行缩进
通过text-indent属性设置，如：text-indent:值;
取值可以是像素，也可以是em 推荐写法：text-indent:2em;
首行缩进, 首行缩进, 首行缩进
4.3 字体下划线和删除线
通过text-decoration属性设置，如：text-decoration:值;
取值：underline 下划线
line-through 删除线，贯穿线
none 去掉多余的样式
字体的下划线
5 行高
行高控制的是文字与文字之间的上下距离 （行距）
line-height:值;- 值的取值是像素，也可以是倍数，如：line-height:1.5;
- 如果将标签的高度和行高设置成一样，那么这个标签里面的文字可以在这个标签里面垂直居中
- 与text-align: center;结合使用可以让单行文字在标签内部水平垂直居中
行高，设置水平垂直居中
6 其它注意事项
1、 颜色属性
颜色属性的取值可以是：
- 英文(如：red)
- 十六进制（如：#ff0000）
- rgb(red, green, blue)
- rgba(red, green, blue, alpha)
background-color: rgb(256, 0, 0);2、css的注释
css的注释与html的注释不一样
/* css的注释 */