还在拿flex进行布局吗？快来试试grid网格布局吧

例：

遇到这种布局要求我们应该怎么办？

方法1：使用flex布局

    <style>

      * {

        padding: 0;

        margin: 0;

      }

      .gird_Box {

        width: 100vw;

        height: 500px;

        display: flex;

      }

      .item1 {

        background-color: pink;

        flex: 1;

      }

      .line {

        background-color: palegreen;

        width: 20px;

      }

      .item3 {

        background-color: skyblue;

        flex: 1;

      }

    </style>

  </head>

  <body>

    <div class="gird_Box">

      <div class="item1">item1</div>

      <div

巴特西

还在拿flex进行布局吗？快来试试grid网格布局吧

方法1：使用flex布局

最新文章

热门文章