什么是CSS？
CSS通常称为CSS样式表或层叠样式表（级联样式表），主要用于设置HTML页面中的文本内容（字体、大小、对齐方式等）、图片的外形（宽高、边框样式、边距等）以及版面的布局等外观显示样式。
CSS以HTML为基础，提供了丰富的功能，如字体、颜色、背景的控制及整体排版等，而且还可以针对不同的浏览器设置不同的样式。
CSS语法
CSS基础语法
CSS规则由两个主要部分构成：选择器以及一条或多条声明。每条声明由一个属性和一个值组成。属性(property)是设置的样式属性，每个属性有一个值，属性和值被冒号分开。比如 selector{property：value}
选择器通常是需要改变样式的HTML元素。比如 h1{color:red; font-size:14px;} h1是选择器，color和font-size是属性，red和14px是值。
注意：如果定义不止一个声明则需要用分号将每个声明分开。例如：p{text-align:center;color:red}，如果值为若干单词，则要给值加引号：例如：p {font-family: "sans serif";}
CSS高级语法
选择器的分组
h1,h2,h3,h4,h5,h6 {
color: green;
}
继承及其问题：根据 CSS，子元素从父元素继承属性。
body {
font-family: Verdana, sans-serif;
}
创建CSS
CSS 创建样式表分为三种情况：
内部样式表
行内式(内联样式)
外部样式表(外链式)
样式优先级：内联样式>内部样式>外部样式三种样式表区别：
行内样式表：优点：书写方便；缺点：没有实现样式和结构相分离；使用情况：较少；控制范围：控制一个标签(少)。
内部样式表：优点：部分结构和样式相分离；缺点：没有彻底分；使用情况：较多；控制范围：控制一个页面(中)。
外部样式表：优点：完全实现结构和样式相分离；缺点：需要引入；使用情况：最多，推荐；控制范围：控制整个站点(多)。
id和class选择器
ID选择器
id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式，id 属性和身份证一样具有唯一性。
HTML元素以 id 属性来设置 id 选择器，CSS 中 id 选择器以 "#" 来定义。注意：id 属性不能以数字开头。
语法：
#id名{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; }
class选择器
class 选择器用于描述一组元素的样式，也叫做类选择器。
class 可以在多个元素中使用，并且一个元素也可以指定多个类名。
在 CSS 中，类选择器以一个点 "." 号来定义。
同样的类名的第一个字符也不能使用数字。
语法：
.类名{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; }
ID 选择器和类（class）选择器的区别
相同点：
● 都可以应用于任何元素
不同点：
● ID 选择器只能在文档中使用一次，而类选择器可以使用多次。
● 可以使用类选择器词列表方法为一个元素同时设置多个样式(也就是一个元素可以制定多个类名)，而ID只能指定一个。
CSS元素选择器
最常见的CSS选择器就是元素选择器，也就是标签选择器，也就是在HTML中元素的最基本的选择器。
语法：
标签名{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; } 或者
元素名{属性1:属性值1; 属性2:属性值2; 属性3:属性值3; }
标签选择器最大的优点是能快速为页面中同类型的标签统一样式，同时这也是他的缺点，不能设计差异化样式。
CSS背景
background 属性用于定义 HTML 元素的背景。
定义元素背景效果的 CSS 属性有五种：
background-color | 背景颜色 |
background-image | 背景图像 |
background-repeat | 背景图像设置水平或垂直平铺或不平铺 |
background-position | 背景图像设置定位 |
background-attachment | 背景图像设置固定或滚动 |
背景属性简写：
background:green url('images/fix.gif') no-repeat fixed 12px 24px;
}
当使用简写属性时，属性值的顺序依次为：
background-color --> background-image --> background-repeat -->
background-attachment --> background-position
CSS外观属性
CSS文本格式主要分为：文本颜色(color)、文本对齐方式、文本修饰、文本阴影、文本缩进、文本间距、字间距、文本空白处理、文本转换。
文本对齐方式：text-align属性有四个值：left，center，right，justify(两端对齐)；属性默认值为auto。
文本修饰：text-decoration 属性用来设置或删除文本的修饰。
主要是用来删除超链接的下划线，也可以使用其他值来设置文本的修饰；
text-decoration:overline，设置文本上划线。
text-decoration:line-through; 设置文本中间划线。
text-decoration:underline; 设置文本下划线。
文本阴影：text-shadow: x y shadow color；
其中 x 是水平阴影的偏移值，
y 是垂直阴影的偏移值，
shadow 用于指定阴影的模糊值，即模糊效果的作用距离，不允许负值。
color 指定阴影的颜色。该属性有两个作用，产生阴影和模糊主体。
文本缩进：用来指定文本的首行缩进，允许为负值，如果值是负数，第一行则向左缩进。
CSS表示为：text-indent:2em，em 是相对文字大小的单位，1em 就是1个文字大小，2em 就是两个文字大小。
文本间距：行高，也就是文本行的高度。例如：line-height：22px。
字间距：letter-spacing 和 word-spacing 这两个属性都可用来增加或减少文本间的空白，即字间距。
不同的是：
letter-spacing 属性设置字符间距，而 word-spacing 属性设置单词间距。注意：word-spacing 属性对中文无效，因此在设置中文的字间距时请使用 letter-spacing 属性。letter-spacing 和 text-align：justify 是两个冲突的属性，不能同时使用；
text-align:justify 是设置内容根据宽度自动调整字间距，使各行的长度恰好相等，实现文本两端对齐效果，
而 letter-spacing 是指定一个固定的字间距。
文本空白处理：white-space 属性指定元素内的空白如何处理，默认值为 normal 空白会被浏览器忽略。
该属性还有4个值：
nowrap 文本不会换行，禁止换行，文本会在同一行上继续，直到遇到
标签为止。
pre 空白会被浏览器保留，这种方式类似 HTML 中的
标签，用于定义预格式文本
pre-wrap 指定保留空白符序列，但是正常地进行换行
pre-line 指定合并空白符序列，但是保留换行符，并允许自动换行。
文本转换：text-transform 属性控制文本中的字母。是用来指定在一个文本中的大写和小写字母，可用于将所有字句变成大写或小写字母，或每个单词的首字母大写。
text-transform:capitalize， 定义文本中的每个单词以大写字母开头。
text-transform:uppercase，定义文本仅有大写字母。
text-transform:lowercase，定义文本仅有小写字母
