css选择器

• 标签选择器

       p  { color : red ; font-size : 15px ; ｝

• id选择器

  #dv { color : red ; font-size : 15px ; }

•  类选择器   

  .content { color : red ; font-size : 15px ;  }

  
  

• 属性选择器

  [alt] { color : red ; font-size : 15px ;  }

  [alt="文字"] { color : red ; font-size : 15px ;  }

  [title] { color : red ; font-size : 15px ;  }

  [title="文字"] { color : red ; font-size : 15px ;  }

  [title~="文字"]  { color : red ; font-size : 15px ;  }       title的属性值里面包含“文字”内容的标签~代表有空格的

  [title=^"文字"]  { color : red ; font-size : 15px ;  }      ^"文字"  以"文字"开头的title   css3

  [title=$"文字"]   { color : red ; font-size : 15px ;  }      $"文字"   以"文字"结尾的title   css3

  [title*="文字"]    { color : red ; font-size : 15px ;  }     title中的值包含"文字"的元素  css3

  input[type="text"]  { width :100px ; height :30px ; }

  input[type="button"]  { width :100px ; height :30px ; }

  
  

• 群组选择器

  h1,h2,h3,span,div  { color : red ; font-size : 15px ;  }

• 后代选择器

  div  span  { color : red ; font-size : 15px ;  }   div下面的span(父子关系 ，爷孙关系)

• 子代选择器

  div > span  { color : red ; font-size : 15px ;  }   div下面的直接挨着的span(父子关系)

  
  

• li : first-child { color : red ; font-size : 15px ;  }

  li : last-child  { color : red ; font-size : 15px ;  }

  li : nth-child(2)  { color : red ; font-size : 15px ;  }

  li : nth-child (odd) { color : red ; font-size : 15px ;  }  li的奇数 2n+1

  li : nth-child (even)  { color : red ; font-size : 15px ;  }  li的偶数 2n
  

  
  

• 通配符选择器

  *  {   margin : 0 ; padding : 0 ; }  不建议使用，有替代它的代码

• 同辈选择器    （不推荐使用）