html5/Css3 自应式

来源：互联网发布：电力系统仿真软件综述编辑：程序博客网时间：2024/04/29 16:50

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>自应式</title>    <style>        *{            margin:0;            padding:0;        }        html,body{            width: 100%;            height: 100%;            overflow: hidden;        }        .container{            width: 100%;        }        .center{            width: 100%;            height: 500px;            background: red;            float: left;        }        .left,.right{            width: 250px;            height: 500px;            float: left;            background: green;        }        .right{            background: blue;        }        .left{            margin-left: -100%;        }        .right{            margin-left: -250px;        }        p{            width: 100%;            padding: 0px 250px;        }    </style></head><body>    <div class="container">        <div class="center"><p>中间</p></div>        <div class="left">左边</div>        <div class="right">右边</div>    </div></body></html>

阅读全文

0 0