python css选择器_(2018-05-02.Python从Zero到One)二、(前端)CSS__1.2.4css选择器

css选择器

常用的选择器有如下几种:

1、标签选择器

标签选择器,此种选择器影响范围大,建议尽量应用在层级选择器中。

举例:

*{margin:0;padding:0}

div{color:red}

....
....

2、id选择器

通过id名来选择元素,元素的id名称不能重复,所以一个样式设置项只能对应于页面上一个元素,不能复用,id名一般给程序使用,所以不推荐使用id作为选择器。

举例:

#box{color:red}

....

3、类选择器

通过类名来选择元素,一个类可应用于多个元素,一个元素上也可以使用多个类,应用灵活,可复用,是css中应用最多的一种选择器。

举例:

.red{color:red}

.big{font-size:20px}

.mt10{margin-top:10px}

....

....

....

4、层级选择器

主要应用在选择父元素下的子元素,或者子元素下面的子元素,可与标签元素结合使用,减少命名,同时也可以通过层级,防止命名冲突。

举例:

.box span{color:red}

.box .red{color:pink}

.red{color:red}

....

....

....

5、组选择器

多个选择器,如果有同样的样式设置,可以使用组选择器。

举例:

.box1,.box2,.box3{width:100px;height:100px}

.box1{background:red}

.box2{background:pink}

.box2{background:gold}

....
....
....

6、伪类及伪元素选择器

常用的伪类选择器有hover,表示鼠标悬浮在元素上时的状态,伪元素选择器有before和after,它们可以通过样式在元素中插入内容。

.box1:hover{color:red}

.box2:before{content:'行首文字';}

.box3:after{content:'行尾文字';}

....
....
....
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值