• 网站首页
• 网站建设
• 短视频
• 网站推广
• 网站模板
• 客户案例
• 资讯动态
• 关于我们

js修改css选择器属性，怎样区分后代选择器和子代选择器_CSS学习

当前位置：网站建设 > 技术支持

1、js修改css选择器属性，怎样区分后代选择器和子代选择器？

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;/*给物理 力学 声学 电磁学 和数学 微积分 概率论博弈论都加一个红色方框*/}这说明子代是他是单传只给物理和数学就断子绝孙，后代是一代传一代。

子代选择器时效果图：

后代选择器时效果图：

2、css复合选择器有哪三种？

1、元素选择器 标签名{ }

2、id选择器 #id属性值{ }

3、类选择器 .class属性值{ }

4、选择器分组(并集选择器)

作用：通过它可以同时选中多个选择器对应的元素(通常用于集体声明)

语法：选择器1，选择器2，选择器n{ }

5、复合选择器(交集选择器)

作用：选择更准确更精细的目标元素并为其设置属性

语法：选择器1选择器2选择器n{ }

!注意选择器之间不能有空格，要紧挨在一起

6、通配选择器

作用：用来选中页面中所有的元素

语法：*{ }

7、后代元素选择器

作用：选中指定元素的指定后代元素

语法：祖先元素 后代元素{ }

8、子元素选择器

作用：选中指定父元素的子元素

语法：父元素>子元素

9、伪类选择器

伪类表示元素的一种特殊状态

:hover 移入时元素的状态

:visited 已被访问过后的元素的状态

:active 被点击时元素的状态

10、 属性选择器

作用：根据元素中的属性或属性值来选取指定元素

语法：[属性名]选取含有指定属性的元素

? [属性名=“属性值”]选取含指定属性值的元素

? [属性名^="属性值"] 选取属性值以指定内容开头的元素

? [属性名$="属性值"] 选取属性值以指定内容结尾的元素

? [属性名*="属性值"] 选取属性值包含指定内容的元素

11、兄弟元素选择器

+选择器

作用：选中一个元素后紧挨着的指定的兄弟元素

语法：前一个+后一个(作用在后一个)

~选择器

作用：选中后边所有的制定兄弟元素

语法：前一个~后边所有

3、CSS中已设置的属性怎么去掉？

如果代码过多，不好找以前写的样式代码，就只有覆盖了。

我们来看一下开始的代码：

这是我们开始的代码，接下来看一下改了后的代码：

覆盖已有的样式：

1、如图2，如果知道类名在哪个文件，可以将已有的class名来进行使用，将类名写在最后，由于它是顺序执行的，所以写在最后就可以了。

2、可以在行间添加style，来更改属性，如2号位置。

3、可以另外建一个css文件，然后将它放在所以样式后面，如图2的4号位置处就行覆盖。

以上是个人看法，如果有错误的地方请大家指出，谢谢！

4、css中属性可以重用么？

答案是不可以。

因为在css中一个元素针对某种样式只能有一种属性，如果某种样式有多个属性值，那么最下面的属性值会将之前的属性值覆盖掉。

原因是css的属性和属性值是以键值对的形式存在的，相当于js的一个map对象，只能有一个key和一个属性值，多个信息会造成浏览器识别不出来。

版权说明：
本网站凡注明“广州京杭 原创”的皆为本站原创文章，如需转载请注明出处！
本网转载皆注明出处，遵循行业规范，如发现作品内容版权或其它问题的，请与我们联系处理！
欢迎扫描右侧微信二维码与我们联系。