CSS后代选择器“空格”和“>”的使用辨析
要点:
举个栗子:
html代码如下
<body>
<div class="parent">
<p>1p</p>
<div>2div
<p>-2.1p</p>
<p>-2.2p</p>
<a>-2.3a</a>
</div>
<p>3p</p>
<p>4p</p>
</div>
</body>
css代码(带空格的后代选择):
.parent p {
background: red;
}
结果:子代1p 3p 4p 及孙代 2.1p,2.2p都选上了

css代码(带“>”的后代选择):
.parent > p {
background: red;
}
结果:只有子代1p 3p 4p 选上

CSS后代选择器“空格”和“>”的使用辨析的更多相关文章
- css后代选择器(div.class中间不带空格)
如果我要查找<div>上用了.class的元素,查找方法:div.class:中间是不空格的. 以上这种形式为css后代选择器 参考:http://www.w3school.com.cn/ ...
- CSS 后代选择器
后代选择器(descendant selector)又称为包含选择器. 后代选择器可以选择作为某元素后代的元素. 根据上下文选择元素 我们可以定义后代选择器来创建一些规则,使这些规则在某些文档结构中起 ...
- CSS系列(8) CSS后代选择器和子选择器详解
一.CSS后代选择器详解 1, 生动介绍基本概念 一个标签嵌B在另一个标签A内部,B就是A的后代. 而且,B的后代也是A的后代,这就叫“子子孙孙无穷尽也”. 比如: <div> < ...
- CSS后代选择器、子元素选择器、相邻兄弟选择器区别与详解
派生选择器用的很多,派生选择器具体包括为后代选择器.子元素选择器.相邻兄弟选择器,我们来理解一下他们之间的具体用法与区别. 1.css后代选择器语法:h1 em {color:red;} 表示的是从h ...
- 小tip: CSS后代选择器可能的错误认识——张鑫旭
一.关于类选择器的一个问题 假设有下面一个面试题,CSS代码如下: .red { color: red; } .green { color: green; } HTML如下: <div clas ...
- 前端学习笔记之CSS后代选择器、子元素选择器、相邻兄弟选择器区别与详解
派生选择器用的很多,派生选择器具体包括为后代选择器.子元素选择器.相邻兄弟选择器,我们来理解一下他们之间的具体用法与区别. 1.css后代选择器语法:h1 em {color:red;} 表示的是从h ...
- css后代选择器
后代选择器: <p><em>CSS</em>层叠样式</p> 使用后代选择器设置,之间用空格隔开: p em{font-size:40px;} 例子: ...
- CSS后代选择器可能的错误认识
一.关于类选择器的一个问题 CSS代码: .red { color: red; } .green { color: green; } HTML代码: <div class="red&q ...
- CSS后代选择器,子选择器和相邻兄弟选择器
平时在代码练习中,经常用到后代选择器,子选择器也会用到,这里做个总结: 1,后代选择器和子选择器区别: ①写法不一样:后代选择器的标识为:空格 如:ul li{width:150px;} [ul和li ...
随机推荐
- Android 中与 so 有关的一个大坑
Android 应用开发中不可避免的会引入第三方的代码.如果是开源项目风险相对可控,如果引入商用的 SDK 那就要谨慎了,难免会有这样或那样的问题.比如我们今天要说的这一个. 对集成过第三方 SDK ...
- Android Studio重构之路,我们重新来了解一下Google官方的Android开发工具
Android Studio重构之路,我们重新来了解一下Google官方的Android开发工具 记得我的第一篇博客就是写Android Studio,但是现在看来还是有些粗糙了,所有重构了一下思路, ...
- (NO.00003)iOS游戏简单的机器人投射游戏成形记(十一)
机器人发射子弹已经完成了,下面看看怎么给玩家设置障碍. 大家从上篇的图可以看到,在机器和篮筐直接有若干障碍物.我们先看如何实现它们. 打开SpriteBuilder,在Sprites文件夹中新建Sma ...
- C++ Primer 有感(命名的强制类型转换)
C++四种强制类型转换的方法以及其应用场合,之前有看过这个知识点,但是,面试的时候怎么想也就没有写的很全面,于是,这里整理一下: C++中的四种强制类型转换除了具有C语言强制类型转换的功能外,还可提供 ...
- javascript语法之函数的定义
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 【一天一道LeetCode】#47. Permutations II
一天一道LeetCode系列 (一)题目 Given a collection of numbers that might contain duplicates, return all possibl ...
- Leetcode_123_Best Time to Buy and Sell Stock III
本文是在学习中的总结,欢迎转载但请注明出处:http://blog.csdn.net/pistolove/article/details/43740415 Say you have an array ...
- 在android C/C++ native编程(ndk)中使用logcat
最近在研究Android 2.2 源代码的C/C++层,需要对代码进行一些调试,但是奇怪的是,直接添加LOGD("XXXXXXXX");,使用logcat却看不到任何输出,换成LO ...
- android自定义viewgroup初步之一----抽屉菜单
转载请注明出处 http://blog.csdn.net/wingichoy/article/details/47832151 几天前在慕课网上看到鸿洋老师的 自定义卫星菜单,感觉很有意思,于是看完视 ...
- SpriteBuilder中的碰撞分类(Categories)和掩码(Masks)
假如有2种对象player和触发器(trigger),当玩家进入到触发器区域时则由触发器对象通知所有注册过触发器通知的对象,然后由这些对象自行选择做一些事情,比如:阻碍player的前景,触发陷阱等等 ...