HTML(三)选择器--复杂选择器
1、父子选择器/派生选择器
<div calss="wrapper">
<span calss="box">123</span>
</div>
<span>456</span>
1)方式一
div span{
background-color:red;
}
2）方式二
.wrapper span{
background-color:red;
}
3)方式三
.wrapper .box{
background-color:red;
}
2、直接子元素选择器
<div>
<em>1</em>
<strong>
<em>2</em>
</stong>
</div>
div > em{
background-color:red;
}
3、选择器内核选择方式
从左到右，从右往左？
从右往左
4、并列选择器（重点）
标签、class、id、直接子元素等随便组合
组合后的选择器优先级，按照组合元素相加，权重越高，越优先；
如果权重一样，则后面代码覆盖前面代码，后来先到；
!important跟在选择器后面，则此选择器为权重最高等级;
如果选择器后面都有!important，则根据前面组合元素的权重来决定优先级。
div.demo{
}
#id div p.class{
}
div .classP#idP{
}
5、分组选择器
列子：让下面标签内的元素的背景色都为红色
<body>
<em>1</em>
<strong>2</strong>
<span>3</span>
</body>
方法一
em{
background-color:red;
}
strong{
background-color:red;
}
span{
background-color:red;
}
方法二
em,
strong,
span{
background-color:red;
}
HTML(三)选择器--复杂选择器的更多相关文章
- jQuery-1.9.1源码分析系列（三） Sizzle选择器引擎——总结与性能分析
Sizzle引擎的主体部分已经分析完毕了,今天为这部分划一个句号. a. Sizzle解析流程总结 是时候该做一个总结了.Sizzle解析的流程已经一目了然了. 1.选择器进入Sizzle( sele ...
- 《CSS3实战》读书笔记 第三章：选择器：样式实现的标记
第三章:选择器:样式实现的标记 选择器的魔力在于,让你完全实现对网页样式的掌控.不同的选择器可以用在不同的情况下使用.总之把握的原则是:规范的编码,根据合理地使用选择器,比去背选择器的定义有价值的多. ...
- CSS基础（三）：选择器
常用选择器 元素选择器,即html标记如div,ul,li,p,h1~h6,table等. p { font-size:14px; } h1 { color:#F00; } 复合选择器, 由两个选择器 ...
- 锋利的Jquery解惑系列（三）------ 各路选择器大聚会
申明:初次学习Jquery的选择器时只记得几个和css选择器类似的几个,在这里列出书上写上的各路选择器方便以后的查询和现在的学习 所有例子都来自书上 测试画面: 一.基本选择器 #id, $(&quo ...
- HTML-HTML5+CSS3权威指南阅读（三、CSS选择器）
1.伪元素选择器 first-line, first-letter, before, after 2.属性选择器 [attr*=val]: 如果元素的 attr 属性中包含用 val 指定的字符的话, ...
- CSS3 选择器——属性选择器
上一节在<CSS3选择器——基本选择器>中主要介绍了CSS3选择器的第一部分,这节主要和大家一起来学习CSS3选择器的第二部分——属性选择器.属性选择器早在CSS2中就被引入了,其主要作用 ...
- CSS3选择器——基本选择器
CSS是一种用于屏幕上渲染html,xml等一种语言,CSS主要是在相应的元素中应用样式,来渲染相对应用的元素,那么这样我们选择相应的元素就很重要了,如何选择对应的元素,此时就需要我们所说的选择器.选 ...
- CSS3 选择器——基本选择器
CSS的选择器,我想大家并不会陌生吧,因为天天在使用,但对于CSS3的选择器,要运用的灵活到位,我想对很多朋友还是一定的难度,特别是CSS3中的:nth选择器.那么从现在开始我们先丢开他们版本的区别, ...
- CSS中的选择器之类选择器和id选择器
1.css中的选择器: 1.类选择器,又叫class选择器 2.id选择器 3.html元素选择器(又叫标签选择器) 4.通配符选择器 5.伪类选择器 6.组合选择器(多元素选择器,子元素选择器,后代 ...
随机推荐
- Windows下使用创建多层文件夹 SHCreateDirectoryEx 函数需要注意的问题
1.在使用SHCreateDirectoryEx函数创建多层文件夹的过程中,发现在文件夹路径中,只能使用\\而不能使用/,否则将创建文件夹失败. 2.下面为在MFC中使用的代码片段 CString n ...
- spring aop通过注解实现日志记录
首先是几个概念:连接点(Joinpoint).切点(Pointcut).增强(Advice).切面(Aspect) 另外也要使用到注解. 需求:通过注解定义LogEnable.然后程序运行能够识别定义 ...
- python中configparser模块的使用
configparser模块用于生成和修改常见配置文档,当前模块的名称在 python 3.x 版本中变更为 configparser. 首先要写一个如下所示的配置文件: [DEFAULT] serv ...
- 皮尔逊残差 | Pearson residual
参考:Pearson Residuals 这些概念到底是写什么?怎么产生的? 统计学功力太弱了!
- 表结构中updated_time设计为ON UPDATE CURRENT_TIMESTAMP时，使用过程的一个坑
一.mysql表结构中存在如下设计时 表结构中updated_time设计为ON UPDATE CURRENT_TIMESTAMP时,如下 `updated_time` datetime NOT NU ...
- 算法之如何实现LRU缓冲淘汰策略
1)什么是缓存? 缓存是一种提高数据读取性能的技术,在硬件设计.软件开发中都有着非广泛的应用,比如常见的CPU缓存.数据库缓存.浏览器缓存等等. 2)为什么使用缓存?即缓存的特点缓存的大小是有限的,当 ...
- LeetCode--383--赎金信
问题描述: 给定一个赎金信 (ransom) 字符串和一个杂志(magazine)字符串,判断第一个字符串ransom能不能由第二个字符串magazines里面的字符构成.如果可以构成,返回 true ...
- 20181013xlVba据成绩条生成图片文件
Sub CreateGoalPictures() '声明变量 Dim Wb As Workbook Dim Sht As Worksheet Dim Shp As Shape Dim Pic, End ...
- pycharm配置appium 提示unsrsloved reference
1.如:进入C:\Users\Administrator\PycharmProjects\project\venv 输入:在cmd 下进入 venv 输入 Scripts\activate 回车 ...
- IntelliJ IDEA的调试方法
快捷键F9 resume programe 恢复程序 Alt+F10 show execution point 显示执行断点 F8 S ...