初学CSS3应该掌握哪些基础知识
CSS3简介
如同人类的的进化一样，CSS3是CSS2的“进化”版本，在CSS2基础上，增强或新增了许多特性， 弥补了CSS2的众多不足之处，使得Web开发变得更为高效和便捷。更加好的诠释了能用css解决的问题坚决不用js这句话。
CSS现状
- 浏览器支持程度差，需要添加私有前缀
- 移动端支持优于PC端
- 不断改进中
- 应用相对广泛
怎样应用
- 坚持渐进增强原则（不要优雅降级）
- 考虑用户群体（pc端or手机端）
- 遵照产品的方案（设计稿或者产品原型）
- 听Boss的（领导or甲方需求）
引用前的准备
同一环境
由于CSS3兼容性问题的普遍存在，为了避免因兼容性带来的干扰，我们约定统一的环境，以保证学习的效率，在最后会单独说明兼容性的问题。
下面介绍的是工具版本：
- Chrome浏览器 version 46+
- Firefox浏览器 firefox 42+
- PhotoShop CS6（建议高版本的ps软件）
具体学习那些知识点
CSS3选择器
就像我们学习css2一样，选择器是我们要进行的第一关，CSS3中增加了很多的选择器，更加的便捷，不用起很多的名字也可以选择元素了。
例如属性选择器：
1、E[attr] 表示存在attr属性即可；
2、E[attr=val] 表示属性值完全等于val
3、E[attr~=val] 表示的一个单独的属性值 这个属性值是以空格分隔的
4、E[attr|=val] 表示的要么一个单独的属性值 要么这个属性值是以“-”分隔的
5、E[attr*=val] 表示的属性值里包含val字符并且在“任意”位置
6、E[attr^=val] 表示的属性值里包含val字符并且在“开始”位置
7、E[attr$=val] 表示的属性值里包含val字符并且在“结束”位置
例如伪类选择器
重点理解E是用来参考确定其父元素的，nth-child(n) 对应根据E元素确定的父元素的所有子元素，nth-of-type(n) 的不同之处在于其对应的是只有E元素，会忽略其子元素。（此处要配合案例加强理解）
E:nth-child(n) 第n个子元素，计算方法是E元素的全部兄弟元素
E:nth-of-type(n) 第n个子元素，计算方法只是E元素，会忽略其子元素的
存在
E:nth-last-child(n) 同E:nth-child(n) 计算顺序相反。
E:nth-last-of-type(n) 同E:nth-of-type(n) 计算顺序相反。
n遵循线性变化，其取值1、2、3、4、...
关于n的取值范围：
1、当n做为一个独立值时，n取值为n>=1，例如nth-child(n)
2、当n做一个系数时，n取值为n>=0者n<0，例如nth-child(2n+1)、nth-child(-n+5) 此处需要理解2n+1或者-n+5做为一个整体不能小于1；
E:only-child 表示当前以E确定的父元素，除E之外并无其它子元素（独生子）；
E:only-of-type表示当前以E确定的父元素， 除E之外不能包含其它和E同类型的子元素；
E:target 结合锚点进行使用，处于当前锚点的元素会被选中；
E:empty 选中没有任何子节点的E元素；
例如伪元素选择器
E::selection 可改变选中文本的样式
E::placeholder 可改变placeholder默认样式，这个存在明显的兼容问题，比如::-webkit-input-placeholder，具体参考手册进行对比。
E:after、E:before 在旧版本里是伪类，在新版本里是伪元素，新版本下E:after、E:before会被自动识别为E::after、E::before，按伪元素来对待。
":" 与 "::" 区别在于区分伪类和伪元素
颜色
CSS 中常用的值和单位：CSS 属性是由属性名和属性值组成的，属性名规定了修改什么，而属性值是给定了具体的样式。那么这些值有些是特定的有意义单词，有些是具体的数值，下面我们就来介绍一下这些内容。
在页面编写的时候，很多地方会用到颜色属性，比如文字的颜色、元素的背景颜色、边框的颜色等，那么我们可以通过color、background-color、border-color属性来设置，这些属性的值都有哪些呢？
请查看网站css样式之颜色和单位
关于透明度：
1、opacity子元素会继承父元素的透明度，在实际开发中会带来干扰；
2 、transparent 设置透明度时完全类似于“玻璃”一样的透明；
霍营市场监督管理所投诉举报电话：010-60787760 | 