CSS3
CSS3 = CSS2 + 新语法 对css2进行的扩充、删减、优化
选择器： 标签选择器 类选择器 id选择器
属性选择器
E---element元素 data---属性
<标签 属性="属性值" >-----html元素
E[data] 选择带有data的元素对象，给该元素对象加样式
E[data="one"] 选择带有data的元素对象，并且属性值等于one的加样式
E[data^="o"] 选择带有data的元素对象，并且属性值以o开头的加样式 ^ ----开头
E[data$="e"] 选择带有data的元素对象，并且属性值以e结尾的加样式 $ ----结尾
E[data*="n"] 选择带有data的元素对象，并且属性值包含n的加样式 * ----包含
伪类结构
E:first-child{} 第一个孩子加样式
E:last-child{} 最后一个孩子加样式
E:only-child{} 只有一个孩子(独生子)的加样式
E:nth-child(n){} 第n个孩子加样式 n=1 2 3 4 5 .....
E:nth-child(2n+1){}/E:nth-child(odd){} 奇数孩子加样式 n=1 3 5 7 .....
E:nth-child(2n){}/E:nth-child(even){} 偶数孩子加样式 n=2 4 6 8 ....
伪元素
E:first-letter{} 设置第一个文字
E:first-line{} 设置第一行文字
E::after{} 往盒子里面插入内容 ，插在在盒子里面的后面
E::before{} 往盒子里面插入内容 ，插在在盒子里面的最前面
- 设置文本的阴影
text-shadow： 水平 垂直 模糊强度 颜色 //前两个必须有
例如：text-shadow: 2px 2px 2px blue 水平向右2px，垂直向下2px，模糊强度为2px，颜色为蓝色
-2px -2px 2px blue 水平向左2px，垂直向上2px，模糊强度为2px，颜色为蓝色
可以有多组值，用逗号隔开
- 设置盒子的阴影
box-shadow：水平 垂直 模糊强度 模糊尺寸 颜色 内外阴影 默认是外阴影，但如果是外阴影，不加outset
盒子变成圆角
数值越大越圆
设置半透明
color:rgba(255,0,0,0.3) -----设置文本透明度，第四个数据就是透明度
background:rgba(0,0,0,0.6) ----设置背景透明度
背景图片的尺寸
background-size: 宽度 高度 ; 或者
background-size： cover 背景图片会把整个盒子(宽度和高度)都用背景覆盖上 ------常用的一种方式
background-size： contain 把盒子的宽度和高度中较大的一个覆盖完就停止覆盖了