css后代选择器

 1.1 后代元素选择器

- 语法：

  ```css

  E F {

      样式声明;

  }

  ```

- 描述：【空格】连接一个或多个选择器

- 作用： 选择E元素内部包含的所有F元素

- 代码示例：

  ```css

  .box span{

    background-color:red;

  }

  <div class="box">

    <span>span1是子元素</span>

    <p>

      <span>span2是子元素的子元素</span>

    </p>

  </div>

  //.box内部的所有span变成了红色，包含在.box内部的通称为后代

  ```

E > F {

      样式声明;

  }

  ```

- 描述：【大于】号 连接一个或多个选择器

- 作用： 选择E元素内部包含的所有直接子元素F（第一嵌套层级）

- 实例演示:

  ```css

  .box > span{

    background-color:red;

  }

  <div class="box">

    <span>span1是子元素</span>

    <p>

      <span>span2是子元素的子元素</span>

    </p>

  </div>