zoukankan      html  css  js  c++  java
  • CSS快速入门-组合选择器

    <div class="gradefather"> hello1
      <div class="father">hello2
        <p class="son">hello4</p>
      </div>
      <p>hello3</p>
      <p>hello5</p>
    </div>

    一、A,B :任意选择器 A or B

    div,p {    #所有div或者p标签
    font-size:10px;
    color:blue;
    }

    二、A B:后代选择器,A 标签下的所有B

    div p { #div下所有p标签
    font-size:20px;
    color:green;
    }

    三、A>B:子选择器,仅仅儿子级别会选中.

    gradefather>p {#gradefather的子标签,仅hello3 hello5 会作用
    font-size:20px;
    color:red;
    }
    .father>p {#father的子标签,仅hello4 会作用
    font-size:20px;
    color:red;
    }

    四、A+B:毗邻选择器,仅仅相邻的同级别(兄弟sibling)第一个会选中.

    father+p { #father的第一个邻居,仅仅hello3会作用
    font-size:20px;
    color:green;
    }

    注意:
    1、块级元素可以包含内联元素或某些块级元素,但内联元素不能包含块级元素,它只能包含其它内联元素。块级标签默认占一行,内联标签占内容大小的空间。
    2、有几个特殊的块级元素只能包含内联元素,不能包含块级元素。如h1,h2,h3,h4,h5,h6,p,dt
    3、li内可以包含div
    4、块级元素与块级元素并列、内联元素与内联元素并列。

  • 相关阅读:
    11111 Generalized Matrioshkas
    Uva 442 Matrix Chain Multiplication
    Uva 10815 Andy's First Dictionary
    Uva 537 Artificial Intelligence?
    Uva 340 MasterMind Hints
    SCAU 9508 诸葛给我牌(水泥题)
    Uva 10420 List of Conquests(排序水题)
    Uva 409 Excuses, Excuses!
    10/26
    11/2
  • 原文地址:https://www.cnblogs.com/skyflask/p/8678979.html
Copyright © 2011-2022 走看看