css3新增选择器+属性
1:c3属性前缀
CSS3的浏览器私有属性前缀是一个浏览器生产商经常使用的一种方式。它暗示该CSS属性或规则尚未成为W3C标准的一部分。
chrome 、Safiri 浏览器 : -webkit-
FireFox : -moz-
IE: -ms-
opera : -o-
先写标准的CSS3属性,在写css3属性
2:c3选择器
(1)毗邻选择 和兄弟选择器
/* E1 + E2 毗邻选择器 E 代表元素 fun: 选择所有符合条件的 ---》 和E1紧紧相邻的E2元素 (下一个兄弟)
p1 p3
*/
.box + p {
font-size: 40px;
}
/* ~ 相邻 E1 ~ E2 选择所有符合条件的在E1后的所有相邻E2元素 */
.box ~ p {
color: red;
}
</style>
</head>
<body>
<div class="box" id="box"></div>
<p>我是p元素1</p>
<p>我是p元素2</p>
<div class="box"></div>
<p>我是p元素3</p>
</body>
(2)属性选择器
- [class] fun:选择拥有class属性的元素
- [class=“a”] fun": 选择所有class属性值为a的元素
- [ class^=“a”] fun: 选择符合条件class以a字符作为开头属性值的元素
- [class*=“a”] fun: 选择的是class属性值包含a字符的元素
- [class$=“a”] fun: 选择符合条件class以a字符作为结尾属性值的元素
(3)结构伪类选择器