huangtaoya
侠客
侠客
  • 最后登录2020-03-26
  • 发帖数10
阅读:5890回复:0

[css]CSS3字符串匹配属性选择器和结构性伪类选择器学习

楼主#
更多 发布于:2019-02-17 20:05
1.四种字符串匹配属性选择器

  (1) E[att^="val"] ie6不兼容(^表示以这个值开头的元素)
  (2)E[att$="val"] ie6不兼容($表示以这个值结尾的元素)
  (3) E[att*="val"] 表示这个值包含的字符串
  (4) E[att="val"] 表示属性直接等于这个值


2.结构性伪类选择器    
   (1)匹配父级元素的第N个(要使这个属性生效,p对象必须是某个对象的子元素)(ie6.7.8 Firefox2.0 3.0不兼容)
   语法:P:nth-child{color:#000000}
   (2)匹配父级元素中的倒数第N个元素
   语法:P:last-child(n){color:#000000};(n表示倒数的第几个)
   (3)匹配同级同类中的第N个元素
   语法:p:nth-of-type{};(其他元素会无视)
   (4)匹配同级同类元素中的倒数第N个元素
   语法:P:last-of-type{}
   (5)匹配父元素中的最后一个元素
   语法:P:last-child{color:#000000};
   (6)匹配同级元素中的第一个元素
   语法:P:first-of-type{}
   (7)匹配父级元素中的唯一一个元素
   语法:P:only-child{};
   (8)匹配同类型院中的兄弟元素
   语法:P:only-of-type{};(对其他元素无影响,声明的P元素中能有一个匹配,没有任何子元素的元素)  



-----------
作者:@沉沙
来源:职坐标
原文:http://css.zhizuobiao.com/css-18091700285/

最新喜欢:

jiangchunyanjiangc...
游客


返回顶部

公众号

公众号