css弹性盒子

来源：互联网发布：java futuretask 编辑：程序博客网时间：2024/05/16 14:42
<html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    <title></title>    <style type="text/css">        .weui_media_bd {            -webkit-box-flex: 1;            -webkit-flex: 1;            -ms-flex: 1;            flex: 1;            min-width: 0;            border: solid 1px red;        }        .weui_media_hd {            margin-right: .8em;            width: 60px;            height: 60px;            line-height: 60px;            text-align: center;            border: solid 1px red;        }        #div1 {            display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */            display: -moz-box; /* Firefox 17- */            display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */            display: -moz-flex; /* Firefox 18+ */            display: -ms-flexbox; /* IE 10 */            display: flex;        }    </style></head><body>    <div id="div1">        <div class="weui_media_bd">测试1</div>        <div class="weui_media_hd">测试2</div>    </div></body></html>
0 0