我是头部
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style type="text/css"> *{ padding: 0; margin: 0; box-sizing: border-box; } body{ max-width: 750px; margin: 0 auto; } *::-webkit-scrollbar { display: none; } #content{ height: 100vh; display: flex; flex-direction: column; } .header{ background: red; height: 40px; } .wrap_body{ background: rgba(0, 0, 0, 0.4); flex: 1; overflow-y: scroll; } .bottom{ background: grey; height: 40px; } .center{ height: 1200px; border: 10px; margin: 10px; border: 1px solid #ccc; } </style> </head> <body> <div id="content"> <div class="header">444</div> <div class="wrap_body"> <div class="body"> <div class="center"> </div> <div class="center"> </div> </div> </div> <div class="bottom"> 我是底部 </div> </div> </body> </html>
我是底部