CSS3选择器的使用方法总结
通用选择器
1 * { }通用选择器(CSS2):适用于所有对象。
2 E型(HTML)选择器(CSS1):文档语言的对象类型的DOM选择器。
3个#是ID选择器(CSS1):E对象的唯一标识符ID属性等于不存在作为选择器。
4 e.myclass是一类选择器(CSS1):E对象包含与类属性的选择MyClass。
5 E F:包含选择器(CSS1):选择所有的F元素,由E元素。
CSS3新通用选择器:同级元通用选择器:
1一般选择E ~ F { }:同一水平的F元素后的E元素匹配所有F,EF英孚在同一水平。只要f在E后,E只是一个参考,~ F {背景:# ff0;}
2相邻(相邻)选择器(CSS2):E + F { }:EF单元相邻,即F元素之后的元素是在选定的元素。
包含3个(次)选择器(CSS2):E > F { }:EF不仅可以匹配的E世代,在相邻的下一代
两个属性选择器
1。E { ATT ^ =val}:选择E元,ATT属性和属性值的值的字符串的开始,
2。E { ATT =瓦尔美元}:选择电子元件与ATT属性和结束在瓦尔字符串属性值
3。E { ATT =val}:选择电子元件具有一个ATT属性和属性值是一个字符串值
4。E { ATT | =val}选择电子元件具有一个ATT属性和属性值是一个字符串,开始与Val和分离的连接器。
5。E { ATT }选择E元素与ATT属性。
6。E { ATT =val}选择E元素与ATT属性和属性值相等的价值
7。E { ATT ~ =val}选择一个单词列表与ATT属性和属性值之间用空格,其中一个是相等的值的元素
注:4 ~ 7是CSS2的独特属性,输入是最常用的属性选择器。
三个伪类选择器
1个与用户界面相关的伪类:
(1)E:启用:表单中激活的元素和可在表单中操作的元素。
(2)E:残疾人(常用):常用的元素,禁用=残疾人如:输入{类型=文本}:残疾人{背景:# DDD;}只能被视为不可操作。
(3)e:选中:匹配表单中选定的单选(单选框)或复选框(复选框)元素
是一个完整的伪类(匹配整个DOM文档):
(4):选择与当前用户选择的元素相匹配,即在选定对象时设置颜色。
2结构伪类
1):根与文档的根元素匹配,只与HTML文档的html根元素匹配。
2)E:n个子(n)与当前元素匹配
e:n个子(n):与其父元素e匹配的n个子元素,第一个数字是1。
E:n个子(n):与其父元素E匹配的n f元素,第一个编号为1(貌似只对UL)
3)E:第n个最后的子(n):与其父元素匹配的倒数n个元素,第一个数字是1。
e:最后一个子元素:与父元素匹配的最后一个子元素相当于:第n个最后的子元素(1)。
4)类型的n(n):类似于n个子(n),但只匹配使用相同标号的元素。
5)E:n类型(n)的最后一个:它类似于:n最后一个子(n),但只匹配使用相同标号的元素。
6)e:类型的第一个:与父元素匹配同一标签的第一个子元素等价于:类型的n(1)。
7)E:类型的最后一个:与父元素匹配同一标签的最后一个子元素相当于:类型的最后一个(1)。
8)e:独生子:匹配父元素的唯一子元素。
9)E:仅与类型匹配:在父元素下使用与父元素相同的标签的唯一子元素,它等于类型的第一个:类型的最后一个或第n个类型(1):类型的最后一个(1)。
10)E:空匹配一个不包含任何子元素的元素。注意,文本节点也被视为子元素。空白节点也被视为子节点。
11)e:(s)不匹配不符合当前选择器的任何元素:不(n:n子(1))。
三
1)E:链接{ }:伪类选择器连接设置的超链接在不访问方式。
2)e:访问{链接伪类选择器,在其已访问的链接地址中设置超链接A。
3)e悬停:用户操作伪类选择器,在鼠标悬停时设置元素的样式。
4)e:活动{ }:用户操作伪类选择器,在用户激活时设置元素的样式(鼠标单击和释放之间发生的事件)。
5)E:焦点{ }用户操作的伪类选择器,设置元素的风格,当输入焦点(元素的onfocus事件)。
6)e:{与使用特殊语言的E元素匹配的伪类选择器。
CSS3选择器
在CSS中,选择器是一种模式,用于选择需要添加样式的元素。
CSS列显示哪个版本的属性是CSS版本的定义。(CSS1,CSS2和CSS3。)
选择器
例子
实例的描述
CSS
类。
介绍。
选择类的所有元素。
一
# ID
#名
选择所有元素的id =FirstName。
一
*
*
选择所有元素。
二
元
P
选择所有元素。
一
元,元
DIV,P
选择所有元素和所有元素。
一
元
div p
选择元素内的所有元素。
一
元>元
P
选择父元素的所有元素作为元素。
二
元+元
DIV + P
选择元素后面的所有元素。
二
{属性}
{目标}
用目标属性选择所有元素。
二
{属性值}
{目标= _blank }
选择所有目标=_blank 元素。
二
{属性}值}
{标题=花}
选择标题属性以包含单词花的所有元素。
二
| = {属性值}
{朗| = EN }
选择所有以朗属性值开头的元素。
二
:链接
一:链接
选择所有未访问的链接。
一
:访问
答:访问
选择所有已访问的链接。
一
:主动
一:主动
选择活动链接。
一
:悬停
答:悬停
选择鼠标指针所在的链接。
一
:焦点
输入:焦点
选择获取焦点的输入元素。
二
第一封信:
P:第一个字母
选择每个元素的首字母。
一
:一线
P:一线
选择每个元素的第一行。
一
:第一个孩子
P:第一个孩子
选择属于父元素第一个子元素的每个元素。
二
:前
P:之前
在每个元素的内容之前插入内容。
二
:后
P:后
内容是在每个元素的内容后面插入的。
二
郎(语言)
P:郎(它)
在的开头选择每个属性的值。
二
Element1 ~元素
P ~ UL
选择前面有元素的每个元素。
三
{属性=值}
{}}
在HTTPS 开头选择其SRC属性值的每个元素。
三
{属性=值}
{
选择它的SRC属性以结尾的所有元素。
三
{属性}值}
一个名为abc}
选择每个元素的src属性包含ABC的子串。
三
:第一种
p:第一种类型
选择属于其父元素第一个元素的每个元素。
三
最后类型
P:最后一种类型
选择属于其父元素最后一个元素的每个元素。
三
:只有类型
p:只有类型
选择属于其父元素的惟一元素的每个元素。
三
:唯一的孩子
P:独生子女
选择属于其父元素的唯一子元素的每个元素。
三
n个子(n)
第n个孩子(2)
选择属于其父元素的第二个子元素的每个元素。
三
第n个最后的子(n)
最后一个孩子(2)
同时,从最后一个子元素开始计数。
三
n类型(n)
p:n类型(2)
选择属于其父元素第二个元素的每个元素。
三
n类型(n)最后一个
p:类型的最后一个(2)
这是一样的,但它从最后一个子元素开始计数。
三
:最后一个孩子
最后一个孩子
选择属于其父元素的最后一个子元素的每个元素。
三
:根
:根
选择文档的根元素。
三
:空
P:空
选择的每一个元素的子元素(不包括文本节点)。
三
:目标
#消息:目标
选择当前活动的#新闻元素。
三
:启用
输入:启用
选择启用的每个元素。
三
:禁用
输入:禁用
选择每个禁用元素
三
:检查
输入:检查
选择每个选定的元素。
三
不(选择器)
不(P)
选择非元素的每个元素。
三
::选择
::选择
选择用户选择的元素的一部分。
三