选择符Selector的一些探究
来源:互联网 发布:安装mac os x不能验证 编辑:程序博客网 时间:2024/05/17 08:43
关于选择符Selector
通配选择符 Universal Selector------------>*
小雨的解释“选定文档目录树(DOM)中的所有类型的单一对象。
假如通配选择符不是单一选择符中的唯一组成,“*”可以省略。“
*作为通配选择符,可以代表所有类型的单一对象。例如li *{ }就是指定文档中所有li的样式。
但是这样的用法好像效果不大,即使不写*同样可以收到效果。见过这样的写法rt*,
这样文档中所有出现的rt1,rt2,rt3都会应用rt*的样式,这大概就是主要的用处了。
flashlizi在msn中看到过*>html #local这样的用法,至于为什么这样写,还不太清楚。
后来查了w3的解释:
“The universal selector, written "*", matches the name of any element type. It matches any single element in the document tree.
If the universal selector is not the only component of a simple selector, the "*" may be omitted. For example:
*[lang=fr] and [lang=fr] are equivalent.
*.warning and .warning are equivalent.
*#myid and #myid are equivalent. "
还是人家说得比较清楚。
类选择符 Type Selector
这个比较容易理解:以文档语言对象类型作为选择符。
与DOM中每个Element的实例匹配
h1定义后,文档中所有出现h1标签的地方都会应用该样式
除非你为该标签定义了单独的样式例如h1.single{ }
包含选择符 Descendant Selector
所有被父代包含的标签
e.g., "Match those EM elements that are contained by an H1 element"
Descendant selectors express such a relationship in a pattern.
A descendant selector is made up of two or more selectors separated by whitespace.
包含选择符使用选择符间加空格的形式来表示各个选择符之间的关系,e.g. A B
但是,当A B出现属性重合的时候,问题就来了
e.g. h1 { color: red } em { color: red }
在<H1>This headline is <EM>very</EM> important</H1>中,我们的定义是没有效果的
我们可以这样来实现我们的目的h1 em { color: blue }
最后一点,我们可以使用通配符例如 div * p
甚至可以这样写div p *[href],它表示所有被div&p包含并且有href属性的标签的样式已经被定义了
子对象选择符 Child Selector
子对象选择符是由两个或者更多的选择符通过">"连起来组成
e.g.1 body > P { line-height: 1.3 }
e.g.2 div ol>li p
例子都是表示p作为body或者div ol li的子对象的样式
注意2中">"左右少了空格
Adjacent sibling selectors
在小雨的手册中并没有出现,遵循下面的语法:
E1+E2,当E2出现在E1后,且紧跟在E1后,样式起作用
h1.opener + h2 { margin-top: -5mm }说明只有在具备opener类的h1后,h2才起作用
属性选择符 Attribute selectors
ie中好像不支持,firefox下测试通过
- 选择符Selector的一些探究
- selector选择的用法详解。
- CSS selector选择符 进行CSS网页布局的基础
- iOS H5容器的一些探究(一):UIWebView和WKWebView的比较和选择
- iOS H5 容器的一些探究(一):UIWebView 和 WKWebView 的比较和选择
- iOS H5容器的一些探究:UIWebView和WKWebView的比较和选择
- 关于selector的一些用法
- Selector的一些state使用
- 关于标签的一些探究
- UnityShaderVariant的一些探究心得
- UnityShaderVariant的一些探究心得
- Selector选择按钮的处理问题
- CSS学习(1)选择符selector
- python的decorator的一些探究
- 对于analyze table使用的一些探究
- 自定义ContentProvider的一些细节探究
- 关于实现HLS直播的一些探究
- PHP中复杂类型的一些探究。。。
- 东软,我把青春献给了你……
- 华为一道面试题及其解决方法
- linux c函数库
- 善于使用资源的程序员才是好程序员
- 学习.NET遇到的第一个问题。原来解决这么简单
- 选择符Selector的一些探究
- 当锐气慢慢消散……
- 权限的管理方案
- [翻译] Effective C++, 3rd Edition, Item 42: 理解 typename 的两个含义
- 第几个无休的周末?
- (转载)数据库设计指南----第3 部分— 选择键和索引
- 各类排序算法的比较[摘抄]
- (转载)数据库设计指南----第4 部分— 保证数据的完整性
- 无声无息的消失,我的战友