选择器的应用

1.属性选择器:

   [type=text] 、[type=submit]   属性选择器  直接定位到某个身上

   [type=http://www.baidu.com](错误写法)    [type="http://www.biadu.com"](正确学法)  因为属性选择器不能识别 " :  /  .  空格"  必须用双引号括起来

   [type^="http"]  "^"表示从头开始改变""里面的标签   [type$="http"] "$"表示从结尾开始改变""里面的标签

2.结构伪类选择器:

   :first-child   改变第一行变样式

   :last-child    改变最够一个元素变样式

   :nth-child(odd)  改变奇数行变样式

   :nth-child(even)  改变偶数行变样式

   :nth-child(5)    从第一行开始指定数变样式，中间有其他元素也算数。但是定位到其他标签身上的时候，他不显示

   :nth-last-child(6)    从下往上数定义第几行就第几行变样式

   :first-of-type      第一个元素变样式改变

   :last-of-type       最后一个元素变样式

   :nth-of-type(5)    这个也是从上往下指定变样式，不过这个其中有其他元素的话，不作数，直接不算那个标签。

   :nth-of-type(even)   偶数行变样式

   :nth-of-type(odd)    奇数行变样式

   :nth-last-of-type(6)    这个是从下往上指定变样式

   :only-child        选择器选择的是父元素中只有一个子元素，而且只有唯一的一个子元素。也就是说，匹配的元素的父元素中仅有一个子元素，而且是一个唯一的子元素

   :only-of-type      选择器用来选择一个元素是它的父元素的唯一一个相同类型的子元素。这样说或许不太好理解，换一种说法。

                      :only-of-type是表示一个元素他有很多个子元素，而其中只有一种类型的子元素是唯一的，使用“:only-of-type”选择器就可以选中这个元素中的唯一一个类型子元素。

   :empty             表示空白元素，没有子元素的样式

   :root              表示改变所以元素的样式 注意:冒号前面不添加东西

3.状态伪类选择器:

    :disabled     表示改变禁用表单的样式

    :enabled      正常使用的表单的表单样式

    :focus        鼠标获得焦点之后的样式

    :checkes      选中之后的样式【比如复选框的选中】

4.否定伪类选择器:

    :not([])      除了not([])里面的值，剩下都根据给的样子改变。注意not(.class)这个没有中括号

5.后代选择器:

    .div li    表示.div 下面的li里面所有的内容都改变

    .div>li    表示.div 只有他的子元素运行改变，就是他的儿子

6.目标伪类选择器:

    :target    就是表示点击超链接，他的跳转项目改变

                注意:冒号前面添加的只能是被操作的id值