CSS选择器

CSS选择器

CSS提供了众多的选择器,用于选择想要获取的元素

标签选择器

  • 类选择器
  • 属性选择器
  • 标签选择器
  • div,p 和 div和p
  • div p div内部的所有p元素
    CSS选择器
  • div>p div的子元素为p
    CSS选择器

  • div+p 紧接在div之后的所有p元素
    CSS选择器

    属性选择器

  • [target] 包含target属性的元素
    CSS选择器

  • [target=‘ll‘] taget属性为ll的元素
  • [target~=‘ll‘] taget 属性包含ll的元素
    CSS选择器

  • [target|‘en‘]

    伪类选择器

  • a:link a链接样式
  • a:visited a已被访问样式
  • a:hover a鼠标悬停在链接上样式
  • a:active a激活样式
    CSS选择器

伪元素选择器

  • ::after
  • ::befor
  • Div:first-child 首先是div元素,然后必须是第一个
  • Div:first-of-type 首先是div元素,还是div元素中的第一个
    注意这两种选择器容易混淆,它并不是值div元素的第一个,而是当前选择的元素是div,冒号后边描述改div元素的位置
    CSS选择器
    此时会选择main元素下的第一个div元素
    CSS选择器
    由于div不是第一个,所以不会被选中,但是 first-of-type则会选中
    CSS选择器
    div:first-of-type 和div:nth-of-type(1)具有一样的效果
    CSS选择器

选择器还有很多,等遇到在补充~

相关推荐