常见选择器

常见的css属性选择器有 :

  1. id
  2. class
  3. 标签
  4. 后代
  5. 子选择器 (.one > one_1) 选择父元素为.one的所有.one_1元素
  6. 相邻同胞选择器 (.one + .two) 选择紧接在.one之后的所有.two元素
  7. 群组选择器

css3新增: p~ul 选择前面有p元素的每个ul元素
还有一些不常用的选择器

  1. 伪类选择器

    1. :link 
    2. :visited
    3. :active
    4. :hover
    5. :focus
    6. :first-child
    7. --
    8. css3新增
    9. :first-of-type 父元素的首个元素
    10. :last-of-type 父元素的最后一个元素
    11. :only-of-type 父元素的特定类型的唯一子元素
    12. :only-child 父元素中唯一子元素
    13. :nth-child(n) 选择父元素中第N个子元素
    14. :nth-last-of-type(n) 选择父元素中第N个子元素，从后往前
    15. :last-child 父元素的最后一个元素
    16. :root 设置HTML文档
    17. :empty 指定空的元素
    18. :enabled 选择被禁用元素
    19. :disabled 选择被禁用元素
    20. :checked 选择选中的元素
    21. :not(selector) 选择非 <selector> 元素的所有元素

  2. 伪元素选择器

    1. :first-letter 用于选取指定选择器的首字母
    2. :first-line 选取指定选择器的首行
    3. :before  选择器在被选元素的内弄前面插入的内容
    4. :after 选择器在被选元素的内容后面插入内容

  3. 属性选择器

    1. [attribute] 选择带有attribute属性的元素
    2. [attribute=value] 选择所有使用attribute=value的元素
    3. [attribute~=value] 选择attribute属性包含value的元素
    4. [attribute|=value] 选择attribute属性以value开头的元素
    5. css3新增:
    6. [attribute*=value] 选择attribute属性值包含value的所有元素
    7. [attribute^=value] 选择attribute属性开头为value的所有元素
    8. [attribute$=value] 选择attribute属性结尾为value的所有元素

    优先级

    !import >内联 > ID选择器 > 类选择器 > 标签选择器

不可继承属性

  1. display
  2. 文本属性: vertical-align text-decoration
  3. 盒子模型属性 : 宽度.高度.内外边距,边框
  4. 背景属性
  5. 定位属性