首页 > 代码库 > CSS3 01. CSS3现状、属性选择器、伪类选择器、

CSS3 01. CSS3现状、属性选择器、伪类选择器、

CSS 3 现状

    兼容性差,需添加私有前缀/移动端优于PC端/不断改进中/渐进增强原则/考虑用户群体/遵照产品的方案 ;

    CSS3手册 需要阅读其--阅读及使用指引

[]表示全部的可选项 

|| 或者 

| 表示 多选一 

? 表示 0个或1个

* 表示 0个或多个

{}表示范围  {A}代表出现A次 ,{A,B}代表出现A次以上B次以下 ,B可以省略,{A,} 代表至少出现A次,无上限

# 出现1次以上,以逗号隔开,可以选择后面跟大括号的方式精确表示重复次数:<length>#{1,4}.

!代表出现产生一个值,即使组内的值都可以省略,但至少有一个值不能呗省略:[A?B?C?]!

属性选择器

  标签选择器/类名选择器/id选择器/后代选择器/标签指定(交集)选择器/并集选择器/子代选择器/通配符

    div+p:选择div后第一个p

    div~p:选择div后所有p

  具体有以下5种形式:

    E[attr] 表示存在attr属性即可:   div[class] 

    E[attr=val] 表示属性值完全等于val: div[class=mydemo] ;

    E[attr*=val]  表示的属性值里包含val字符并且在“任意”位置 ;div[class*=mydemo]

    E[attr^=val] 表示的属性值里包含val字符并且在“起始”位置 ; div[class^=mydemo]

    E[attr$=val]  表示的属性值里包含val字符并且在“结束”位置 ;div[class$=mydemo]

伪类选择器:

  :link. 正常状态

  :viaited 已经问过的链接

  :hover 鼠标经过

  :action  点击

  CSS3 新增其他的伪类选择器

    以某元素相对于其

 

CSS3 01. CSS3现状、属性选择器、伪类选择器、