flex弹性盒子布局

我与影子孤独终老i 提交于 2019-11-27 18:43:36
<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>flex</title>    <style>        *{            padding: 0;            margin: 0;        }        body{            background-color: red;        }        .container{            width: 100%;            min-height: 500px;            background-color: yellowgreen;            display: flex;        }        .container .left{            width: 200px;            height: 500px;            background-color: purple;        }        .container .right{            width: 150px;            height: 500px;            background-color: blue;        }        .container .center{            flex-grow: 1;            height: 500px;            background-color: orange;        }    </style></head><body><div class="container"><div class="left"></div>    <div class="center">    </div>    <div class="right"></div></div></body></html>无需多言,就是方便。
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!