HTML中的后代选择器和子代选择器

1.后代选择器。
格式： E F { css样式 } （E和F都是选择器）
作用：访问到E下的所有的F元素（无论嵌套多少层）。
符号：空格。
2.子代选择器。
格式： E>F {css样式 } （E和F都是选择器）
作用：访问到E下的所有的F元素（只访问下一级，只有一层）。
符号： >。

举个栗子：

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title>后代和子代选择器</title><style type="text/css">span{background-color: #FFFF00;}/*访问到class的名字为lanou的元素下的所有sapn标签*//*后代选择器 通过空格符 该元素下的所有子元素（无论嵌套多少层）*/.lanou span{color: red;}/*子代选择器*//*访问到class的名字为lanou的元素的直接下一级（直接访问儿子元素）*/.lanou>span{font-size: 50px;}</style></head><body><div class="lanou"><span>蓝鸥</span><span>科技</span><p><span>硕硕</span></p></div><span>学习使我快乐！</span><!--需求：1.将所有的span标签改为橘黄色2.将div下的所有span标签改为红色3.将 div下直接下一级的span标签，文字大小改为50px--></body>
</html>

栗子图示：

HTML中的后代选择器和子代选择器相关推荐

html子代选择器,Css 后代选择器与子代选择器的区别
后代选择器用空格,比如A B{border:1px solid red;} 子代选择器用>, 比如A>B{border:1px solid red;} 但是,如果你仔细想想,这俩个概念是不 ...
css复合选择器（后代选择器、子代选择器、并集选择器、链接伪类选择器、：focus选择器）
什么是复合选择器? 在css中,可以根据选择器的类型把选择器分为基础选择器和复合选择器,复合选择器是建立在基础选择器之上,对基本选择器进行组合形成的. 复合选择器可以更准确.更高效的选择目标元素(标签 ...
【响应式Web前端设计】CSS后代选择器和子代选择器
文章目录子代选择器:>号后代选择器:空格文章目录子代选择器:>号后代选择器:空格子代选择器:>号 .father>div{border: 2px solid blu ...
html后代选择器和子代选择器,CSS后代选择器与子元素选择器的区别
今天在看css基础的时候,发现了一个很有趣的事情,那就是后代选择器与子元素选择器. 说来也惭愧,我以前一直以为,这俩是同一个东西,只是叫法不同而已,后来才发现,原来这俩是两个不同的东西. 后代选 ...
后代选择器和子代选择器
子代选择器: 子代是指儿子,用>连接,表示一个标签的下一级标签. 后代选择器: 后代是指儿子.孙子等所有的后代,表示一个标签之下的所有要找标签两个标签也可以混合使用例如: $('div &g ...
Web前端第四季(jQuery):四:301-jQuery基本过滤器(奇数和偶数)+302-实现隔行换色+401-祖先选择器和子代选择器
目录一.目的 1.想:学习前端知识 2.想:记录笔记,下次不用看视频,直接看笔记就可以快速回忆. 二.参考 1.我自己代码的GitHub网址 2.SIKI学院:我参考此视频实操 3.w3school ...
html的css样式中表示后代选择器,css样式,后代选择器
css介绍 CSS(层叠样式表)定义如何显示HTML元素,给HTML设置样式,让它更加美观. 当浏览器读到一个样式表,它就会按照这个样式表来对文档进行格式化(渲染). css语法(下图所示) 每个CS ...
【CSS 教程系列第 8 篇】什么是 CSS 中的后代选择器
这是[CSS 教程系列第 8 篇],如果觉得有用的话,欢迎关注专栏. CSS 的选择器有很多,常用的有元素选择器.id 选择器.class 选择器.后代选择器.子代选择器.并集选择器.交集选择器.伪 ...
【CSS 教程系列第 7 篇】什么是 CSS 中的 class 选择器（类选择器）、多类名选择器
这是[CSS 教程系列第 7 篇],如果觉得有用的话,欢迎关注专栏. CSS 的选择器有很多,常用的有元素选择器.id 选择器.class 选择器.后代选择器.子代选择器.并集选择器.交集选择器.伪 ...

HTML中的后代选择器和子代选择器

HTML中的后代选择器和子代选择器相关推荐

最新文章

热门文章

HTML中的 后代选择器 和 子代选择器

HTML中的 后代选择器 和 子代选择器相关推荐

最新文章

热门文章

HTML中的后代选择器和子代选择器

HTML中的后代选择器和子代选择器相关推荐