CSS选择器

2016-09-04 本文已影响56人 Mg明明就是你

选择器的作用

选择对应的标签，为之添加样式

标签选择器

根据标签名找到标签

    eg:
        <div>div1</div>
        <div>div2</div>

    div {
        color：red;
    }

分类

类选择器
- "."+"类名"找到标签
- 类选择器格式：. 类名

    eg:
        <p class="high">第一段文字</p>
        <p>第二段文字</p>
        <div class="high">div1</div>
        <div>div2</div>

    .high  {
        color：red;
    }

结果：

结果.png

id选择器
- "#"+"类名"找到标签
- 类选择器格式：# 类名

    eg:
        <p id="first">第一段文字</p>
        <p>第二段文字</p>

    #first {
        color：red;
    }

结果：

结果.png

并列选择器
- "标签名"+“，”+".类名"找到标签
- 类选择器格式：标签名，.类名

    eg:
        <p class="high">第一段文字</p>
        <p>第二段文字</p>
        <div class="high">div1</div>
        <div>div2</div>

   div， .high  {
        color：red;
    }

结果：