当前位置:首页 > 日记 > 正文

CSS3选择器的使用方法总结

CSS3选择器的使用方法总结
本文将给你介绍的CSS3选择器的使用,包括通用选择器,属性选择器,伪类选择器,在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)
选择非元素的每个元素。

::选择
::选择
选择用户选择的元素的一部分。

相关文章

男孩的男性空间签名不是主流。

男孩的男性空间签名不是主流。

空间,男性,主流,男孩,电脑软件,无论是白天还是晚上,除了手机外,都是电脑陪我分享的非主流个性签名,欢迎阅读: 非主流人格签名: 当地的恋爱时间,异国的费用,没有人的爱费。 钱包,你还记得我吗!我爱你-当你生气的时候,鼓鼓的表情! Ldquo;几乎每个人都上…

ps如何美白牙齿

ps如何美白牙齿

牙齿,电脑软件,ps,本教程是向朋友介绍PS如何制作黄牙增白法。这个教程很基础。非常适合初学者学习。推荐朋友快速学习。 当我们拍照时,人物的五个特征的轮廓与我们的品味一致,但牙齿有点黄,那我该怎么办呢其实方法很简单,下面来介绍一下ps如何…

ps使用滤镜和材质快速将人物转换成

ps使用滤镜和材质快速将人物转换成

滤镜,肖像,转换成,材质,火焰,今天,萧边教你如何使用PS过滤材料把人物肖像为火焰效果。教程很漂亮,制作步骤也不是很复杂。喜欢朋友可以一起学习。 作者制作火焰肖像的方法非常独特。首先,我们用滤波器提取人物轮廓线,然后用通道切割出线条,然后…

论文学艺术的情感人格签名

论文学艺术的情感人格签名

人格,情感,艺术,论文,电脑软件,孤独是一种快乐的悲哀,是一种甜蜜的惆怅,是一种温暖的痛。接下来从小编辑推荐文艺个人签名,希望对你有所帮助! 文艺人格签名: 你活在我记忆的原始荒野里。 每一个记忆都像一根刺,一点点讨厌的字。 如果你能站在我…

幸福的个性签名

幸福的个性签名

个性签名,电脑软件,一旦你学会了打破破碎的罐子,你会发现世界是开放的。我希望能帮助你! 快乐人格签名: 1、这一生注定是你人生的一道风景,我只能在夜晚跳舞时走进你的梦里,像你华丽的梦里一样为你甜甜的一笑。 2,当手的温度穿过皮肤到我的心底…

使用CSS修改HTML的复选框效果的小

使用CSS修改HTML的复选框效果的小

修改,样本,复选框,效果,电脑软件,本文主要介绍用CSS修改html复选框效果的小样本共享,主要用于CSS:检查伪类,您需要的朋友可以参考一下。 使用复选框控制后续元素 CheckBox控件可以根据鼠标点击开关状态,和CSS伪类可以使用:检查为选中复选框的风…

多情的伤感个性签名

多情的伤感个性签名

个性签名,多情,伤感,电脑软件,在别人的生活中,我只是一个配角。下面的小爱多情人格签名,供你参考,希望你能有所收获! 爱情多情人格签名: 这个世界很小,所以我们相遇。世界如此之大,很难再见到你。 因为我掏心掏肺地爱你,所以我只能给你无情。 我真…

QQ空间伤感文字的QQ空间

QQ空间伤感文字的QQ空间

空间,文字,伤感,电脑软件,QQ,心情就像天气一样变幻莫测,用文字来记录当时的心情,这篇文章的个性说你想适合你,喜欢记得一点赞扬。 一是人的心是悲伤的,最幸福的人。这两mdash mdash;张小娴在面包的女人。 第二,我认为爱可以战胜一切,谁知道她有时…

PS图象处理软件的皮肤更加自然和公

PS图象处理软件的皮肤更加自然和公

图象,处理软件,公平,期待,自然,本教程介绍朋友到PS图象处理软件,这是自然的,公正。这个教程很好。非常适合学习。推荐。让我们一起学习。 今天萧边分享PS图象处理软件的角色让更多的天然白皮肤的好方法,使用这种方法可以让学生修复皮肤白,好看,…

带有个性签名的悲伤的个性签名

带有个性签名的悲伤的个性签名

个性签名,悲伤,电脑软件,放肆的笑,但谁能理解我心底的悲伤。让我们给自己一个特别的签名来展示自己的个性。小编辑给大家带来了一些情感签名,供大家参考。 1,对于你,我想把自己推入无尽的黑暗和无尽的痛苦的深渊。 2,找一个人来告诉我心情,但突然…

QQ繁体字快乐签名快乐个性签名

QQ繁体字快乐签名快乐个性签名

繁体字,快乐,个性签名,电脑软件,QQ,计算机已成为一种必不可少的项目,对take-off.but发展信息时代,我相信每个人的电脑是腾讯的重要软件,今天就给你一些QQ繁体字签名的副本。爱的幸福。 1,放弃也是一种解脱。 2、因为你想要一个人而寂寞,因为爱一…

非主流QQ签名非主流

非主流QQ签名非主流

非主流,电脑软件,QQ,我不是回收站,我不会被丢弃;我不是Marysu,我不想去任何一个可怜的人!这是小系列的非主流人物签名大家整理,希望大家可以借鉴! 非主流人格签名: 谁敢动我的兄弟,我的人生留下来杀你的_ 不求红河无兄弟欺兄弟 那个曾经告诉他哥…