CSS3伪类选择器(掌握)
p:nth-child(2) | 选择的p元素是其父级的第二个子元素(不能父盒越过其他元素) | 3 | |
p:nth-last-child(2) | 选择的元素的是其父级的第二个子元素,从最后一个子项计数 | 3 | |
p:nth-of-type(2) | 选择的p元素是其父级的第二个p元素(能父盒越过其他元素) | 3 | |
p:nth-last-of-type(2) | 选择的p元素的是其父级的第二个p元素,从最后一个子项计数 | 3 | |
p:last-child | 指定只有选择每个p元素是其父级的最后一个子级。 | ||
p:first-child | 指定只有当<p>元素是其父级的第一个子级的样式 |
CSS3伪元素选择器(掌握)
个<P>元素的第一个字母或者第一个汉字 | 1 | ||
p::first-line | 选择每一个<P>元素的第一行 | 1 | |
p::before | 在每个<p>元素之前插入内容 | 2 | |
p::after | 在每个<p>元素之后插入内容 |
RGBA颜色
RGBA颜色值被IE9, Firefox3+, Chrome, Safari,和Opera10+支持。
RGBA颜色值是RGB颜色值alpha通道的延伸 - 指定对象的透明度。
RGBA颜色值指定:RGBA(红,绿,蓝,alpha)。 Alpha参数是一个介于0.0(完全透明)和1.0(完全不透明)之间的参数
p{
background-color:rgba(255,0,0,0.5);
}
HSL颜色
IE9, Firefox, Chrome, Safari,和Opera 10+.支持HSL颜色值。
HSL代表色相,饱和度和亮度 - 使用色彩圆柱坐标表示。
HSL颜色值指定:HSL(色调,饱和度,明度)。
色相是在色轮上的程度(从0到360)-0(或360)是红色的,120是绿色的,240是蓝色的。饱和度是一个百分比值; 0%意味着灰色。100%的阴影是全彩。亮度也是一个百分点; 0%是黑色的,100%是白色的。
p{
background-color:hsl(120,65%,75%);
}
CSS3 文本阴影
text-shadow: 5px 5px 5px #FF0000;
CSS3 盒阴影
box-shadow: 10px 10px 5px #888888;