博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
css 选择器
阅读量:5134 次
发布时间:2019-06-13

本文共 1212 字,大约阅读时间需要 4 分钟。

element element      eg:div p  (选择<div>元素内部所有的<p>元素)

element>element     eg:div>p (选择父元素为<div>元素的所有<p>元素)

element+element     eg:div+p (选择紧接在<div>元素之后的所有<p>元素)

element1~element2  eg:p~ul(选择前面有 <p> 元素的每个 <ul> 元素)

[attribute~=value]     eg:[title~=flower]  (选择title属性包含单词“flower”的所有元素)

[attribute|=value]      eg:[lang|=en]  (选择lang属性值以“en”开头的元素)

[attribute^=value]     eg:a[src^="https"](选择其 src 属性值以 "https" 开头的每个 <a> 元素)

[attribute$=value]     eg:a[src$=".pdf"](选择其src属性以".pdf"结尾的所有<a>元素)

[attribute*=value]     eg:a[src*="abc"](选择其 src 属性中包含 "abc" 子串的每个 <a> 元素)

:link        eg:a:link  (选择所有未被访问的链接)

:visited         eg:a:visited(选择所有已被访问的链接)

:active       eg:a:active(选择活动链接)

:checked     eg:input:checked(选择每个被选中的<input>元素)

:first-letter       eg:p:first-letter(选择每个<p>元素的首字母)

:first-line       eg:p:first-line(选择每个<p>元素的首行)

:first-child     eg:p:first-child(选择属于父元素的第一个子元素的每个<p>元素)

:last-child    (同上)

:first-of-type    eg:p:first-of-type(选择属于其父元素的首个 <p> 元素的每个 <p> 元素)

:nth-child(n)       eg:p:nth-child(2)(选择属于其父元素的第二个子元素的每个 <p> 元素)

:nth-last-child(n)      eg:p:nth-last-child(2)(同上,从最后一个子元素开始计数)

:nth-of-type(n)    eg:p:nth-of-type(2)(选择属于其父元素第二个 <p> 元素的每个 <p> 元素)

:nth-last-of-type(n) eg:p:nth-last-of-type(2)(同上)

转载于:https://www.cnblogs.com/wujiaqi/p/7851612.html

你可能感兴趣的文章
nginx --rhel6.5
查看>>
Eclipse Python插件 PyDev
查看>>
selenium+python3模拟键盘实现粘贴、复制
查看>>
第一篇博客
查看>>
typeof与instanceof的区别
查看>>
网站搭建(一)
查看>>
SDWebImage源码解读之SDWebImageDownloaderOperation
查看>>
elastaticsearch
查看>>
postgreSQL 简单命令操作
查看>>
Spring JDBCTemplate
查看>>
Radon变换——MATLAB
查看>>
第五章笔记
查看>>
Iroha and a Grid AtCoder - 1974(思维水题)
查看>>
gzip
查看>>
转负二进制(个人模版)
查看>>
LintCode-Backpack
查看>>
查询数据库锁
查看>>
[LeetCode] Palindrome Number
查看>>
我对于脚本程序的理解——百度轻应用有感
查看>>
SQL更新某列包含XX的所有值
查看>>