CSS选择器

选择器——帮助我们获得页面上要设置样式的元素//通过怎样的途径来获得页面上要设置样式的元素,样式规则的

1. HTML Selector(当页面中所有的某种标签都显示同一种样式的时候,HTML选择器最为简单)

    <style type="text/css">

      p{

        background-color:yellow;

      }

      tt{

        background-color:green;

      }

    </style>

2. CLASS Selector( class选择器 )

    <style type="text/css">

      tt.tt1{

        background-color:red;

      }

    </style>

    ……

    <body>

      <tt class="tt1">床前明月光,疑是地上霜。举头望明月,低头思故乡。</tt>

      <tt class="tt1">床前明月光,疑是地上霜。举头望明月,低头思故乡。</tt>

      <tt class="tt2">床前明月光,疑是地上霜。举头望明月,低头思故乡。</tt>

      <tt>床前明月光,疑是地上霜。举头望明月,低头思故乡。</tt>

    </body>

3.  ID 选择器(需要给要设置样式的元素的id属性赋值)(尽量保证每一个id都是唯一的)

    ……

    #p1{

    }

    ……

    <p id="p1">今天天气好晴朗</p>

4. 关联选择器(由于标签的嵌套所以才使用得到)

    p em{

    }

    ……

    <p><em>今天天气好晴朗</em></p>

    <em>哈哈哈</em>

    <p>今天天气好晴朗</p>

5. 组合选择器

    h1,h2,h3,h4,h5,h6,td{

    }

6. 伪元素选择器

    伪元素选择器是指对同一个HTML元素的各种状态和其所包括的部分内容的一种定义方式。例如:

      对于超链接标签(<a></a>)的正常状态(没有任何动作前)、访问过的状态、选中状态、

    光标移到超链接文本上的状态,对于段落的首字母和首行,都可以使用伪元素选择器俩定义。

  目前常用的伪元素有以下几种:

    A:active    选中超链接时的状态

    A:hover    移到

    A:link       正常状态

    A:visited    访问过的

    P:first-line

    P:first-letter

原文地址:https://www.cnblogs.com/zhangchaoran/p/6802715.html