<!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>
html5/Css3 自应式
最新推荐文章于 2022-01-13 11:48:30 发布