专业网站建设品牌,十四年专业建站经验,服务6000+客户--广州京杭网络
免费热线:400-683-0016      微信咨询  |  联系我们

css选择器文档,CSS选择器权重如何计算_CSS学习

当前位置:网站建设 > 技术支持
资料来源:网络整理       时间:2023/3/4 1:35:05       共计:3582 浏览

css选择器文档,CSS选择器权重如何计算?

很古老的话题了

id=100

class=10

tag(标签)=1

按照这个规律去计算,比如

#qietu div{}

100+1 = 101

.qietu .box{}

10+10=20

可以得出第一个的权重要比第二个要高。另外关于权重的扩展知识面,我推荐了解下BEM命名规则,这个观念很好,可以从侧面杜绝权重问题的产生,还有一个就是提高权重的方法 !important;

input标签中type怎么用css选择?

可以用css3中新增的选择器“[attribute=value]”来同时选中指定的属性的标签。

1、新建html文档,添加5个input标签,其中第一个和最后一个“type”属性的属性值为“text”:

2、在head标签和body标签之间添加style标签,添加代码“input[type=text]”,“input”指的是标签名,“type”指的是属性名,“text”指的是属性值,这个就会把所有属性名为“type”、属性值为“text”的input标签选中:

3、为被选择的标签设置背景色为红色,这时属性值为“text”的第一个标签和最后一个标签背景色都变成了红色:

css选择器加是什么?

css选择器加.是类选择器,选择与class属性相匹配的类名

怎样区分后代选择器和子代选择器?

1.第一从符号上来区分后代选择器:是用空格来分隔开来 例如<h1>一个<span>人</span>的战争</h1> 就是h1 span{}子代选择器:用特殊符号> 例如 h1>span{}

2.第二从用法上区分后代选择器html部分:<ul class="study"> <li>物理 <ul> <li>力学</li> <li>声学</li> <li>电磁学</li> </ul> </li> <li>数学 <ul> <li>微积分</li> <li>概率论</li> <li>博弈论</li> </ul> </li> </ul> css部分//使用子代选择器的效果.study >li{ border:1px solid red;/*只给物理和数学加一个红色方框*/}//使用后代选择器的效果.study li{ border:1px solid red;/*给物理 力学 声学 电磁学 和数学 微积分 概率论博弈论都加一个红色方框*/}这说明子代是他是单传只给物理和数学就断子绝孙,后代是一代传一代。

子代选择器时效果图:

后代选择器时效果图:

版权说明:
本网站凡注明“广州京杭 原创”的皆为本站原创文章,如需转载请注明出处!
本网转载皆注明出处,遵循行业规范,如发现作品内容版权或其它问题的,请与我们联系处理!
欢迎扫描右侧微信二维码与我们联系。
·上一条:vue和css选择器,el属性的属性值是什么类型_CSS学习 | ·下一条:css选择器标识,css选择器加是什么_CSS学习

Copyright © 广州京杭网络科技有限公司 2005-2025 版权所有    粤ICP备16019765号 

广州京杭网络科技有限公司 版权所有