CSS基本用法(二)

CSS3

CSS3是对CSS2的扩充，删减，优化

结构伪类

选择器	功能
E:first-child	匹配第一个孩子
E:last-child	匹配最后一个孩子
E:nth-child(n)	匹配第n个孩子
E:nth-child(2n)或E:nth-child(even)	匹配偶数的孩子
E:nth-child(2n+1)或E:nth-child(odd)	匹配奇数的孩子
E:only-child	匹配有且仅有一个孩子

border-collapse

用来合并表格的边线，其值为:collapse,例如border-collapse:collapse;

伪元素

选择器	功能
:first-letter	操作当前元素中第一个字
:first-line	操作当前元素中第一个行文字
:before	在之前插入，在一个盒子内部的最前面
:after	在之后插入，在一个盒子内部的最后面

文本阴影

text-shadow:水平阴影、垂直阴影、模糊举例、阴影颜色

向文本添加一个或者多个阴影，为逗号分隔的阴影列表，每个阴影由2个到3个长度值和1个可选的颜色值组成，省略的长度为0。

值	描述
h-shadow	必需。水平阴影的位置。允许负值
v-shadow	必须。垂直阴影的位置。允许负值
blur	可选。模糊的距离
color	可选。阴影的颜色

描述：

• text-shadow 文字阴影可以有多组值，多组之间用逗号隔开就可以
• h-shadow 水平阴影正值阴影在右边 负值在左边
• v-shadow垂直阴影正值在下边，负值在上边
• blur 模糊强度，值越大越模糊

盒子阴影

box-shadow:水平方向阴影、垂直方向阴影、模糊距离、阴影尺寸、阴影颜色、内/外阴影

水平阴影和垂直阴影必需，其他可以省略 语法：box-shadow:h-shadow v-shadow blur spread color inset 注释：向框添加一个或者多个阴影，为逗号分隔的列表，每个阴影由2-4个长度值、可选的颜色以及可选的inset关键词来规定。省略的长度值为0。

值	描述
h-shadow	必需。水平阴影的位置。允许负值
v-shadow	必需。垂直阴影的位置。允许负值
blur	可选。模糊距离
spread	可选。阴影尺寸
color	可选。阴影颜色
inset	可选。将外部阴影改为内部阴影

• box-shadow 盒子阴影可以有多组值，以逗号隔开
• h-shadow 水平阴影正值在右边，负值在左边
• v-shadow 垂直阴影正值在下边，负值在上边
• blur 模糊尺寸，值越大越模糊

圆角矩形

border-radius 值的顺序为： 左上 右上 右下 左下；值一样时写为一个值。单位px；

CSS透明度

有颜色的标签可以设置透明度：格式为rgba(红色，绿色，蓝色，透明度) a:透明度，值为0到1，0表示完全透明，1表示完全不透明。 - 背景颜色透明 background-color:rgba(255,255,255,0.3)