网上下载了一个网站单页维护源码,本来简简单单的几句代码就可以实现的,非得搞那么多无用的css,真实受不了呀,所以还是手动写吧:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>网站维护中</title> </head> <style> *{padding: 0;margin: 0;} body{background: #fafafa;} .container{display: flex;align-items:center;height:100vh;flex-wrap: wrap;} .content{flex:1;margin: 0 15px;text-align: center;margin-bottom: 300px;} .content img{max-width: 240px;margin-bottom: 20px;} .content p{font-size: 1.5rem;color: #bebebe;font-weight: bold;} .bottom{content:'';background: url('./bg.png') no-repeat;width: 100%;height: 200px;background-size: cover;display: block;position: absolute;bottom:120px} </style> <body> <section class="container"> <div class="content"> <img src="./logo.gif" alt="站点维护中"> <p>网站维护中。。</p> </div> <div class="bottom"></div> </section> </body> </html>