CSS3 基于关系的选择器
选择器 | 选择的元素 |
A E |
元素A的任一后代元素E (后代节点指A的子节点,子节点的子节点,以此类推) |
A > E |
元素A的任一子元素E(也就是直系后代) |
E:first-child |
任一是其父母结点的第一个子节点的元素E |
B + E |
元素B的任一下一个兄弟元素E |
B ~ E |
B元素后面的拥有共同父元素的兄弟元素E |
你可以任意组合以表达更复杂的关系。
你还可以使用星号(*)来表示”任意元素“。
一般情况下,如果你提高了某个选择器的的确定度,你便提高它的优先级。
使用这个技巧,可以避免为大量标签指定 class
或 id
属性。CSS(引擎)会帮你做的。
在复杂设计中速度非常重要,避免使用复杂的依赖元素关系的规则可以使你的样式更有效率。
更多关于表格的例子,见 Tables。
CSS3 基于关系的选择器的更多相关文章
- 使用基于关系的选择器和伪类选择器创建纯CSS无JavaScript的鼠标移动到上面即可显示的下拉菜单
html代码: <div class="menu-bar"> <ul> <li> <h3 class="text-warning ...
- Atitit.隔行换色 变色 css3 结构性伪类选择器
Atitit.隔行换色 变色 css3 结构性伪类选择器 1.1. css3隔行换色扩展阅读 1 1.2. 结构伪选择器 1 1.3. jQuery 选择器2 1.1. css3隔行换色扩展阅读 原 ...
- CSS3常用30种选择器总结
CSS3常用30种选择器总结 HTML5/CSS3时尚的圆盘时钟动画 带当前日期 www.html5tricks.com/demo/html5-css3-clock-with-date/index.h ...
- CSS3 结构伪类选择器 详解
1 CSS3 结构伪类选择器 1.E:root 匹配E元素所在的根元素 即:html 2. E:nth-child(n) (1)匹配E元素的父元素中第n个子元素,(2)且该位置的子元素类型必须是E类型 ...
- css3新增加的选择器
css3新增加的选择器 一.属性选择器: E[attr] 只要有属性名E[attr=value] 属性名=属性值E[attr~=blue] 包含这个blue整个单词就可以E[attr^=c] 以这个字 ...
- T-SQL 基于关系分割字符串
今天晚上学习了下 SQL 基于关系的运算,同时也捉摸着写了个例子,虽然我知道性能不是很好,还有待优化.直接上源代码吧,思路表达出来有点困难,直接贴上代码,如果有人不懂得可以MM 我. declare ...
- css3学习系列之选择器(一)
CSS3中的属性选择器 [att*=val]属性选择器:[att*=val]属性选择器的含义是:如果元素att表示的属性之属性值中包含用val指定的字符的话,则该元素使用这个样式. [att^=val ...
- CSS3学习系列之选择器(二)
first-child选择器和last-child选择器 first-child指定第一个元素.last-child指定最后一个子元素. 例如: <!DOCTYPE html> <h ...
- CSS3的[att$=val]选择器
1.实例源码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. ...
随机推荐
- 前端学HTTP之数据传输
× 目录 [1]客户机处理 [2]集线器处理 [3]路由器1处理[4]路由器2处理[5]交换机处理[6]服务器处理[7]反向传输 前面的话 上一篇中,介绍了网络基础.本文将详细介绍客户机在浏览网页ab ...
- cmder git bash 使用
cmder 是一款 windows 下的命令集合软件,它可以集合各种系统下的命令,并且操作非常快速方便. 安装有两个版本,一个是简化版(4.27M),一个是完全版(75.7M),它们的唯一区别:完全版 ...
- PHP的学习--在Atom中使用XDebug(Mac)
之前写过一篇博客<PHP的学习--在sublime中使用XDebug(Ubuntu)>,讲了在Ubuntu系统 sublime 中配置 XDebug,其实配置好之后,我也很少用,原因有两点 ...
- 我的runloop学习笔记
前言:公司项目终于忙的差不多了,最近比较闲,想起叶大说过的iOS面试三把刀,GCD.runtime.runloop,runtime之前已经总结过了,GCD在另一篇博客里也做了一些小总结,今天准备把ru ...
- iis6.0与asp.net的运行原理
这几天上网翻阅了不少前辈们的关于iis和asp.net运行原理的博客,学的有点零零散散,花了好长时间做了一个小结(虽然文字不多,但也花了不少时间呢),鄙人不才,难免有理解不道的地方,还望前辈们不吝赐教 ...
- sql将查询的结果集一次性插入到表变量中
sql代码: declare @Subject table (--题目表变量 SubjectID int, Question nvarchar(MAX), CorrectAnswer ), Expla ...
- Go语言开发
Go语言圣经(中文版) Go编程语言规范 搭建Go开发及调试环境(LiteIDE + GoClipse) -- Windows篇 Go开发工具 Go命令行操作命令详细介绍 ...
- Yii 2.x Behavior - 类图
yii\base\Component 继承这个类的类都具备扩展行为的能力
- PALIN - The Next Palindrome 对称的数
A positive integer is called a palindrome if its representation in the decimal system is the same wh ...
- 《连载 | 物联网框架ServerSuperIO教程》- 5.轮询通讯模式开发及注意事项。附:网友制作的类库说明(CHM)
1.C#跨平台物联网通讯框架ServerSuperIO(SSIO)介绍 <连载 | 物联网框架ServerSuperIO教程>1.4种通讯模式机制. <连载 | 物联网框架Serve ...