zoukankan      html  css  js  c++  java
  • flex实现两侧固定中间自适应

     
     
    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0">
        <title></title>
        <!-- IMPORT CSS -->
        <link rel="stylesheet" href="css/reset.min.css">
        <style>
            /* html,
            body {
                overflow: hidden;
            } */
            .container {
                display: flex;
                justify-content: space-between;
                height: 100%;
            }
            .left,
            .right {
                flex: 0 0 200px;
                height: 200px;
                background: lightblue;
            }
            .center {
                flex: 1;
                min-height: 400px;
                background: lightsalmon;
            }
        </style>
    </head>
    <body>
        <div class="container">
            <div class="left"></div>
            <div class="center"></div>
            <div class="right"></div>
        </div>
    </body>
    </html>
     
  • 相关阅读:
    flyway
    xxl-job
    响应式布局
    position: fixed
    position: absolute
    position: relative
    GDB高级一点的命令
    坑爹的大页内存
    input8按键对照
    discuz插件应用原理分析
  • 原文地址:https://www.cnblogs.com/1609359841qq/p/12337287.html
Copyright © 2011-2022 走看看