CSS3 浏览器支持情况 网址查询:caniuse.com
CSS3的伪类选择器(一) 动态伪类选器
a:link{} a:visited{} a:hover{} a:active{} UI元素状态伪类选择器 html部分:
// disable 是状态 CSS部分:(根据状态确定样式)
input :enable{} input:disable{} CSS3的伪类选择器(二) 结构伪类选择器 html部分:
<ul>
<li a href=""></li>
<li a href=""></li>
<li a href=""></li>
<li a href=""></li>
<li a href=""></li>
<li a href=""></li>
<li a href=""></li>
</ul>
css部分
li:fist-child{} 元素的第一个子元素选中
li:last-child{} 元素的最后一个子元素选中
li:nth-child(****){} 选中顺序从左往右
li:nth-child(2n){} 元素的第偶数个子元素选中
li:nth-child(2n+1){} 元素的第奇数个子元素选中
li:nth-child(n+5){} 元素从第5个子元素开始选中
li:nth-child(4n+1){} 元素每4个元素选中
li:nth-last-child(){} 选中顺序从右往左
li:nth-of-type(){} 限定是li标签的子元素 从前往后
li:nth-last-of-type{} 从后往前
li:fist-of-type{} 限定是第一个li标签子元素
li:last-of-type{} 限定是最后一个li标签子元素
li:only-child{} 选择的元素是它父元素只有一个子元素
li:only-of-type{} 选择的元素是它父元素只有一个子元素,但是限制子元素的标签类型为li
li:empty{} 选中的li标签父元素是空的
伪元素 html:
css:
.demo::first-letter{} 文本段落首字 .demo::first-line{} 文本段落首行
.demo::before{ //demo之前
content:; //伪元素的content属性必须要有,不设置也要有,留空
}
.demo::after{ //demo之后
content:;
}
扫码关注腾讯云开发者
领取腾讯云代金券
Copyright © 2013 - 2025 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号:粤B2-20090059 深公网安备号 44030502008569
腾讯云计算(北京)有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287
Copyright © 2013 - 2025 Tencent Cloud.
All Rights Reserved. 腾讯云 版权所有