*{ margin: 0; padding: 0; } html{ width: 100%; height: 100%; } body{ width: 100%; height: 100%; display: flex; flex-direction:column; } .head{ background: rgb(245,245,245); flex: 1; width: 100%; } .head .content{ width: 80%; height: 100%; margin: 0 auto; } .middle{ background: url("../img/background2.jpg") no-repeat; background-size:100% 100%; flex: 15; display: flex; overflow: auto; } .middle .box{ width: 80%; background: white; margin: 0 auto; }