CSS Selector (选择器)

创建时间:
2014-02-28 12:57
最近更新:
2018-09-18 13:28

Resource - Standard

  1. Selectors Level 3 - W3C Recommendation 29 September 2011

Resource - w3school.com.cn

  1. CSS 选择器参考手册
  2. 分组与继承
  3. CSS 分组、选择器分组、声明分组、通配符选择器
  4. CSS 元素选择器 - 在 W3C 标准中,元素选择器又称为类型选择器 (type selector)
  1. CSS ID 选择器
  2. CSS ID 选择器详解
  1. CSS 类选择器
  2. CSS 类选择器 - 注意: 类名的第一个字符不能使用数字! 它无法在 Mozilla 或 Firefox 中起作用
  3. CSS 类选择器 - 类选择器结合元素选择器、多类选择器
  1. CSS 属性选择器
  2. CSS 属性选择器详解
  1. CSS1 element element 选择器
  2. CSS1 派生选择器 - 在 CSS1 中称为 "上下文选择器",在 CSS2 中称为 "派生选择器"。它就是 "后代选择器","后代选择器" 又称为 "包含选择器"。无论如何称呼它,它的作用都是相同的。
  3. CSS1 后代选择器 - A B 选择若干个 BB 必须满足条件 "在 A 内部 或者说 是 A 的后代元素"。`` `` 是该选择器的符号,它就是一个空格,称为 "后代结合符",该符号 前后的空格将被忽略。兼容性: 所有主流浏览器都支持该选择器。
  1. CSS2 element>element 选择器
  2. CSS2 子元素选择器 - A>B 选择若干个 BB 必须满足条件 "是 A 的直接子元素 (非 任意后代元素)"。> 前后的空格将被忽略。兼容性: 所有主流浏览器都支持该选择器。对于 IE8 及更早版本的浏览器中的该选择器,必须声明 <!DOCTYPE>
  1. CSS2 element+element 选择器
  2. CSS2 相邻兄弟选择器 - A+B 选择若干个 BB 必须满足条件 "与 A 同父、紧随 A 之后"。+ 前后的空格将被忽略。兼容性: 所有主流浏览器都支持该选择器。对于 IE8 及更早版本的浏览器中的该选择器,必须声明 <!DOCTYPE>
  1. CSS3 element1~element2 选择器
  2. CSS3 其后兄弟选择器 - A~B 选择若干个 BB 必须满足条件 "与 A 同父、在 A 之后,但 B 不必直接紧随 A"。~ 前后的空格将被忽略。兼容性: 所有主流浏览器都支持该选择器。对于 IE8 中的该选择器,必须声明 <!DOCTYPE>
  1. CSS 伪类 (Pseudo-Classes)
  2. CSS 伪元素 (Pseudo-Elements)

Resource

  1. 神通广大的 CSS3 选择器

CSS :after & :before 选择器

  1. CSS :after 选择器
  2. CSS :before 选择器

Example - 为表单必填项加上红色星号

label.Required:after
{
    content: '*';
    color: #f00;
    position: relative;
    left: 25px;
}