老师,为什么我加了浮动为什么还是竖着摆放的啊?

<!DOCTYPE html>

<html lang="en">

  <head>

    <meta charset="UTF-8" />

    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <title>Document</title>

    <style>

      .boot {

        width: 600px;

        height: 600px;

        background-color: azure;

      }

      .left {

        width: 300px;

        height: 600px;

        background-color: pink;

        float: left;


      }

      .right{

        width: 400px;

        height: 600px;

        background-color: aquamarine;

        float: left;

      }

    </style>

  </head>

  <body>



    <div class="boot">

      <div class="left"></div>

      <div class="right">

        <div class="top"></div>

        <div class="bottom">

          <div class="sleft"></div>

          <div class="sright"></div>

        </div>

      </div>

    </div>

  </body>

</html>



相关课程:WEB前端全系列>第一阶段:HTML5+CSS3模块>初识CSS>布局实操一

©2014-2023 百战汇智(北京)科技有限公司 All Rights Reserved 北京亦庄经济开发区科创十四街 赛蒂国际工业园
网站维护:百战汇智(北京)科技有限公司
京公网安备 11011402011233号    京ICP备13018289号-12    营业执照    经营许可证:京B2-20212637