后代选择器与子元素选择器

最新推荐文章于 2024-08-17 10:09:50 发布
最新推荐文章于 2024-08-17 10:09:50 发布
阅读量983 收藏
点赞数
分类专栏： 前端 文章标签： 前端 选择器
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/slyslyme/article/details/80410409
版权

1.   后代选择器：找到其后代，包括儿子孙子 曾孙等，改变属性

      标签名称1 标签名称2{}

      使用空格做连接符

2.   子元素选择器：找到其特定直接子元素改变属性

      标签名称1>标签名称2{} 

       注意：不能有空格

       选中直接标签（特定的儿子标签）


以上都是可以标签、ID、类class混用作为选择器






_Always_
关注
专栏目录
css后代选择器使用方法实例
09-25
CSS后代选择器是一种强大的工具，用于在样式表中指定元素的特定子元素或者后代元素的样式。这个选择器允许我们精确地控制文档的结构，并且只应用样式到我们需要的那些部分，而不会影响到其他不相关的元素。在这个...
CSS子元素选择器使用介绍
09-25
当我们谈论子元素选择器时，它与后代选择器有着明显的区别。后代选择器可以选择某个元素内的所有后代元素，包括子元素、孙元素以及其他更深层次的后代元素。而子元素选择器仅针对直接子元素生效，不会选择更深层次的...
CSS后代选择器、子元素选择器、相邻兄弟选择器区别与详解
weixin_30487701的博客
10-17 157
派生选择器用的很多，派生选择器具体包括为后代选择器、子元素选择器、相邻兄弟选择器，我们来理解一下他们之间的具体用法与区别。 1、css后代选择器语法：h1 em {color:red;} 表示的是从h1开始里面包含的所有的em元素变成红色，h1为祖先，其他的em都是后代，即选中后代，不管是儿子还是孙子，只要是都会被选中，为后代选择器。例如 <html> <head&g...
后代选择器和子元素选择器
努力努力再努力
03-27 1418
一、后代选择器 后代：儿子，孙子，重孙子......                                                 标签1是父标签，标签2是标签1的儿子，标签3是标签1的孙子，标签4是标签1的重孙子。 所以 标签2,3,4,都是标签1的后代标签。 后代选择器的优势： （1）如果在公司中有几千
18.后代选择器,子代选择器,并集选择器,交集选择器
最新发布
Little_Green1的博客
08-17 1015
这里我就写了两个选择器嘛,一个<p>标签选择器一个类选择器,然后上面那句话:选中同时满足多个条件的元素,第一个<p>标签,满足了标签选择器,还使用了class属性.属性值为box,也满足了类选择器,所以选中第一个标签,第二个<p>标签只满足标签选择器,第三个<div>标签只满足类选择器.所以只会选中第一个.有并集就有交集,两兄弟属于是.交集选择器选中同时满足多个条件的元素,选择器写法:选择器1选择器2,选择器之间连写.如果交集选择器中有标签选择器,标签选择器写最前面。
CSS的子选择器与后代选择器的区别
热门推荐
11-16 4万+
子选择器 还有一个比较有用的选择器子选择器，即大于符号(>),用于选择指定标签元素的第一代子元素。如右侧代码编辑器中的代码： .food>li{border:1px solid red;} 这行代码会使class名为food下的子元素li（水果、蔬菜）加入红色实线边框。
子选择器和后代选择器
m0_62200674的博客
07-10 3438
有例子讲解
后代选择器和子元素选择器的区别
SwingDance的博客
07-30 205
直接上案例，概念请走w3c [https://www.w3school.com.cn/css/css_selector_child.asp] 比如说只要选择class为box的li标签而不选到最内层的li标签该如何做？ 单纯用后代选择器很难做到吧！这时候子代选择器就出场了,可以这样写: <style> div > ul > li{ 注：>是指只能一代接一代，比如：div > ul > li } </style> 如果想选择div中所有l
css后代选择器和子选择器的区别介绍
09-25
后代选择器可以选取某个元素的所有后代元素，而子选择器仅选取直接子元素。下面详细介绍这两者之间的区别，包括用法、兼容性以及实际效果的不同。 首先，我们从用法上来看两者的区别。后代选择器使用空格来表示，它...
css 串联选择器和后代选择器介绍及示例
12-13
CSS（层叠样式表）是网页设计中用于控制页面元素样式的重要工具。串联选择器和后代选择器是CSS...同时，这两种选择器也是构建更复杂选择器的基础，如子元素选择器（>`）、相邻兄弟选择器（+）和一般同胞选择器（~）等。
CSS 子元素选择器
houpainansheng688的博客
06-15 192
所有选择器参考手册：http://www.w3school.com.cn/cssref/css_selectors.asp 1）子元素选择器 参考链接：http://www.w3school.com.cn/cssref/selector_nth-child.asp p:nth-child(2) { background:#ff0000; } 选择所有的p元素 的 父元素...
子选择器和后代选择符的区别
bailang3277的博客
05-29 247
直接上代码和效果图: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>子选择符</title> <style type="text/c...
子选择器&&包含(后代)选择器
whpu1234的博客
08-07 698
1.子选择器   &lt;div class="food"&gt; &lt;h1&gt;你好&lt;/h1&gt; &lt;/div&gt;   如：.food &gt; h1{ color:red; }      a：&gt; 于号用于指定标签元素的第一代子元素（后代） 2.包含（后代）选择器   &lt;div class="food"&gt;      &l
包含(后代)选择器
bailang3277的博客
05-29 122
包含选择器，即加入空格,用于选择指定标签元素下的后辈元素。如下方的代码： .first span{color:red;} 这行代码会使第一段文字内容中的“胆小如鼠”字体颜色变为红色。 请注意这个选择器与子选择器的区别，子选择器（child selector）仅是指它的直接后代，或者你可以理解为作用于子元素的第一代后代。而后代选择器是作用于所有子后代元素。后代选择器通过空格来进...
关于css后代选择器和子选择器的区别
daluzi的博客
04-24 411
后代选择器（h1 div）和子选择器（h1&gt;p）用法基本没什么区别，唯一的区别是，后代选择器像下面例子这样作用于div是可以的： &lt;h1&gt; &lt;div&gt;后代选择器 &lt;/div&gt; &lt;/h1&gt; 而子选择器像下面例子，通过h1&gt;p是作用不到p元素的，因为这里的p属于h1子代的子代。 &lt;h1&gt; &lt;span&gt; &am
子选择器
北半球先生的博客
06-26 260
子选择器 还有一个比较有用的选择器子选择器，即大于符号(>),用于选择指定标签元素的第一代子元素。如右侧代码编辑器中的代码： .food>li{border:1px solid red;} 这行代码会使class名为food下的子元素li（水果、蔬菜）加入红色实线边框。 eg: 子选择符 .food>li>ul>li{border:1px s
后代选择器和子选择器
入梦镜
11-01 2794
后代选择器 1.什么是后代选择器? 作用: 找到指定标签的所有特定的后代标签, 设置属性 格式: 标签名称1 标签名称2{ 属性:值; } 先找到所有名称叫做"标签名称1"的标签, 然后再在这个标签下面去查找所有名称叫做"标签名称2"的标签, 然后在设置属性 div p{} 注意点: 1.后代选择器必须用空格隔开 2.后代不仅仅是儿子, 也包括孙子/重孙子, 只要最终是放到指定标签中的都是后代...
子元素选择器和后代选择器同时使用
dragonjadehua的博客
09-15 364
子元素选择器和后代选择器比较
CSS3选择器详解：后代与子元素选择器
1. 按祖先元素选择要格式化的元素（后代选择器） 这种选择器允许你根据元素的祖先层级来选择和格式化元素。例如，`ancestor descendant` 的结构表示选择所有属于`ancestor`类的元素内的`descendant`元素。在描述中...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值