1-6：css3新增的属性
1、
不同的浏览器可能需要不同的前缀：
eg： -webkit - color:red;
2、选择器：
1）属性选择器：
eg：E[att$="val"]：选择具有att属性且属性值为以val结尾的字符串的E元素
// 将会命中1，3两个div，因为匹配到了class属性，且属性值以c结尾。
2）伪类选择器：
（其元素必须与父元素匹配）
n遵循线性变化，n=0、1、2......
3）否定选择器：
（ E：not( ) 选择除某个元素之外的所有元素）
// 给表单中除submit按钮之外的input元素添加1px的实线红色边框
4）伪元素选择器：
E::first-letter （文本中的第一个字母或字）
// 杂志常用的首字下沉效果
E::first-line （文本第一行）
E::selection （可改变选中文本的样式，如：字体、背景）
E::before和E::after（在元素内部开始位置和结束为止创建一个元素，该元素为行内元素，且必须要结合conten属性使用）
after属性：如以下所示，可以在网页中向字后面加竖线，并且可以设置样式：
content: "" ; 双引号里面写需要添加的内容。加竖线时，不需要填内容。加内容时不需要position。
（css3规定，”：“表示伪类，”：：“表示伪元素）
3、CSS3新增属性：
1）颜色：
RGBA（）：A表示透明度，不会影响子元素的透明度，取值为0~1之间。
HSLA（）：H S L A
色调，取值0~360 饱和度，0%~100% 亮度，0%~100% 透明度0~1
0/360表示红色，120表示绿色，240表示蓝色
关于css透明度：
Ⅰ)opacity只能针对整个盒子设置透明度，子盒子及内容会继承父盒子的透明度；
Ⅱ)RGBA用作背景颜色时，只会让背景透明，文字不透明，且子盒子不继承父盒子
关于隐藏盒子：
Ⅰ)visibility:hidden; 隐藏，原来位置会被保留
Ⅱ)display:none; 隐藏，原来位置不会被保留
2）文本：
text-indent:2em （首行缩进两个字，一个字16px=1em）
text-overflow （设置是否使用一个省略标记标识对象内文本的溢出）
实现溢出文本显示省略号的效果代码：
text-shadow （文本阴影）
语法：text-shadow:X-Offset Y-Offset blur color;
X表示阴影水平偏移距离，正值右偏。Y垂直偏移，正直下偏。
blur阴影的模糊程度，不需要模糊设置为0，单位px。
4、边框：
1）边框圆角：
border-radius
（顺时针）
简写模式：border-radius: 10px; 四个角的横纵轴半径都为10px；
border-radius: 10px 5px; 1和3横纵轴半径为10px，2和4横纵轴半径为5px；
border-radius: 10px 5px 8px; 表示1模纵轴半径都为10px，2和4横纵轴半径都为5px，3角的横纵轴半径都为8px；
border-radius: 10px 8px 6px 4px; 表示1横纵轴半径都为10px，表示2横纵轴半径都为8px，表示3横纵轴半径都为6px，表示4横纵轴半径都为4px；
eg：
2）边框阴影：
box-shadow
与与文字阴影类似，可分别设置盒子阴影偏移量、模糊度、颜色（可设透明度）
（inset可以设置内阴影）
TIPs：设置边框阴影不会改变盒子的大小，即不会影响其兄弟元素的布局。可以设置多重边框阴影，实现更好的效果，增强立体感。
5、渐变（背景-属性）：
1）线性渐变：
指沿着某条直线朝一个方向产生渐变效果
linear-gradient（）
语法：方向 起始色 终止色
// 从黄色渐变到绿色
方向：（默认是从上到下）
2）径向渐变：
从一个中心点开始沿着四周产生渐变 效果
radial-gradient（）
默认渐变中心是center，渐变形状是ellipse（椭圆形），渐变的大小是farthest-corner（表示到最远的角落）
效果图如下所示
eg：制作导航栏