一直都以为,子代选择器与后代选择器作用是一样的,都是选择一个元素下面的子元素,直到今天才明白:

1.子代选择器(用<连接):ul>li

子选择器仅仅选择ul包围的 子元素 中的 li元素,不包括孙元素、曾孙元素等;

2.后代选择器(用空格连接):ul li

后代选择器是选择ul包围的 所有元素中的所有li元素,包括子元素、孙元素、曾孙元素等;

css——子代与后代选择器的更多相关文章

  1. CSS系列之后代选择器、子选择器和相邻兄弟选择器

    后代选择器比子选择器的范围大,包含子选择器,且包含子选择器的“子孙”选择器,后代选择器使用"空格"符号间隔选择器 子选择器:子选择器只是父选择器的一级子元素,使用"> ...

  2. css 串联选择器和后代选择器

    串联选择器:作用在同一个标签上 <div class=”a” id ="qq"><span>look at the color</span>&l ...

  3. 认识CSS中css引入方式、选择器、文本样式设置以及显示模式

    前端之HTML.CSS(三) CSS CSS-Cascading Styles Sheets,层叠样式表.用于网页的表现,主要用于布局和修饰网页. CSS引入方式 CSS的三种引入方式:行内样式,内部 ...

  4. CSS学习笔记之选择器

    目录 1.元素选择器 2.继承 3.选择器分组 4.声明分组 5.后代选择器 6.子元素选择器 7.相邻兄弟选择器 8.类选择器 9.ID 选择器 10.属性选择器 11.伪类 12.伪元素 1.元素 ...

  5. HTML+CSS教程(四)选择器(id选择器,类选择器,标签选择器,子代选择器,后代选择器,组选择器,伪类选择器)/css引入页面的形式(行内样式、内嵌样式、外联样式)

    一.回顾内容 前端的三大组成(三大模块)    HTMl(超文本标记语言) 结构层    css(层叠样式表) 表现层:用来美化HTML结构    JS(Java script)(脚本语言) 行为层: ...

  6. css的高级选择器,后代选择器,子代选择器,并集选择器,交集选择器

    高级选择器: 后代选择器 子代选择器 并集选择器 交集选择器 一.后代选择器: 使用空格表示后代选择器,父元素的后代(包括儿子,孙子,从孙子) 也就是说,box类下的所有span标签 字体颜色都被设置 ...

  7. 子代选择器(>)后代选择器(' ')的区别

    子代选择器是指紧接着父级的那个标签,如:container>a指的是紧接着container后面的第一个a(儿子级别的,孙子或者之后的a是不能生效的) 后代选择器是用空格分开的,如:contai ...

  8. CSS后代选择器可能的错误认识

    一.关于类选择器的一个问题 CSS代码: .red { color: red; } .green { color: green; } HTML代码: <div class="red&q ...

  9. CSS 后代选择器

    后代选择器(descendant selector)又称为包含选择器. 后代选择器可以选择作为某元素后代的元素. 根据上下文选择元素 我们可以定义后代选择器来创建一些规则,使这些规则在某些文档结构中起 ...

随机推荐

  1. git bash下的选择、复制、粘贴

      1. 打开git bash     2.点击左上角,选择属性,打钩     3.回到界面,选择一行文字,然后点击 “右键”,这样就复制到剪切板了.再点 “右键”,可以粘贴到命令窗口中了.    

  2. React生命周期浅析

    引言 关于React的生命周期API,官网,有着详细说明.但在实际写代码的过程中,这些说明不能解决所有的疑惑. 所以我列举了一些编码中常见用例,供大家参考. 示例代码如下 /* use case 1. ...

  3. XAF应用开发教程(一) 创建项目

    XAF是DevExpress公司的快速开发框架,全称eXpress Application Framework,是企业信息系统的开发利器,快速开发效果显著,在.net框架中,笔者至今没有找到一款可以与 ...

  4. SAP供应商和客户的创建

    进来遇到一个创建供应商的需求,由于在系统中关于供应商和客户的创建比较特殊,且没有相关函数进行创建, 找到一个类和方法来创建,类名:VMD_EI_API  方法名:MAINTAIN_DIRECT_INP ...

  5. mysql概要(十)触发器

    1触发器可监视增删改,并触发增删改操作. 针对一些逻辑关联密切的操作,而不必手动多次操作. 2.要素: 3.语法: 补充:mysql可以设置结束符,不必是“:”来结束标志,可使用 3.1简单的例子: ...

  6. angularjs探秘<一>

    首先聊聊angularjs是啥. 首先AngularJS 是一个 JavaScript 框架.(PS:其实就是外部引用的js文件) 所以AngularJS的使用依然是外部引用js文件. 附上引用地址 ...

  7. web设计经验<七>13步打造优雅的WEB字体

    今天,大多数浏览器已经默认支持Web字体,日趋增多的字体特性被嵌入最新版HTML和CSS标准中,Web字体即将迎来一个趋于复杂的崭新时代.下面是一些基本的关于字体的规则,特别适用于Web字体. 原文地 ...

  8. css3动画导航实现

    代码 <!DOCTYPE html> <!-- saved from url=(0223)file:///C:/Users/user/AppData/Local/Temp/HZ$D. ...

  9. 半平面交模板(O(n*n)&& O(n*log(n))

    摘自http://blog.csdn.net/accry/article/details/6070621 首先解决问题:什么是半平面? 顾名思义,半平面就是指平面的一半,我们知道,一条直线可以将平面分 ...

  10. hdu 5339 Untitled

    这题很明显是签到题,可我比赛时却没做出,赤裸裸的爆零了,真悲剧…… 看了题解后才知道直接暴搜就行,只是需要把它们从大到小排序后再搜,我当时就没想到...不想再多说了 一开始我直接枚举所有情况: #in ...