编程技术

Document

非常好看的闭站单页面网站源码

昨天在一个技术群里碰见一个女生想要一个打开首页以后看到其他页面，也就是我们所说的关闭站点，在群里看到还有个人说帮她弄，最后也没有管，我就默默的联系了一下那个女生问了她一下看她弄好了没有结果没有，于是……废话不多说了，直接上干货

<!DOCTYPE html>
<html lang='zh-cn'>
    <head>
        <meta charset='UTF-8'>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
        <title>系统维护-新起点博客</title>
        <style>
            .zm {font-size:13px;width:340px;margin-left: -20px;}
.zm1 {color:#007BFF;}
html,body {height:90%;margin:0;padding:0;}
body {font-family:'Microsoft YaHei';align-items:center;}
a {text-decoration:none;}
#container {max-width:700px;flex-basis:100%;margin:0 auto;background:#FFF;box-shadow:0 0 30px rgba(0,0,0,0.3);-webkit-box-shadow:0 0 30px rgba(0,0,0,0.3);overflow:hidden;}
<!-- url图片路径内替换为自己想要的图 -->
#container #hero-img {width:100%;height:400px;background: #333; background: url("http://www.lehuisou.com/wp-content/uploads/2020/06/202006151301495.png") center 0px repeat-x;}
#container #profile-img {width:140px;height:140px;margin:-80px auto 0 auto;border:6px solid #FFF;border-radius:50%;box-shadow:0 0 5px rgba(90,90,90,0.3);}
#container #profile-img img {width:100%;border-radius:50%;}
#container #content {width:100%;margin:0 auto;padding:0 0 20px 0;}
#container #content h1 {font-size:30px;font-weight:500;margin:30px 0 0 0;}
#container #content p1 {font-size:15px;font-weight:400;line-height:1.4;color:#666;margin:15px 0 40px 0;}
#container #content a {color: darkgray; margin:0 10px;transition:color .3s ease-in-out;-webkit-transition:color .3s ease-in-out;}
#container #content a:hover {color:#007bff;}
#container #content ul {padding: 0%;}
#container #content ul li{list-style: none; text-align: center;}
#container #content li{line-height: 48px;}
.btn {background:none repeat scroll 0 0 #1BA1E2;border:0 none;border-radius:2px;color:#FFFFFF !important;cursor:pointer;font-family:"Open Sans","Hiragino Sans GB","Microsoft YaHei","WenQuanYi Micro Hei",Arial,Verdana,Tahoma,sans-serif;font-size:14px;padding:6px 10%;}
.btn:hover,.yanshibtn:hover {background:none repeat scroll 0 0 #9B59B6;border:0 none;border-radius:2px;color:#FFFFFF!important;cursor:pointer;font-family:"Open Sans","Hiragino Sans GB","Microsoft YaHei","WenQuanYi Micro Hei",Arial,Verdana,Tahoma,sans-serif;font-size:14px;padding:8px 10%;}
</style>
    </head>
    <body>
        <div id='container'>
            <div id='hero-img'></div>
            <div id='profile-img'>
                <!-- src图片路径内替换为自己想要的图 -->
                <img src='http://www.lehuisou.com/wp-content/uploads/2020/06/2020061513015939.jpg' />
            </div>
            <div id='content'>
                <ul>
                    <li>由于目前网盘等问题</li>
                    <li>网站暂停访问了</li>
                    
                    <!-- src图片路径内替换为自己想要的图 -->
                    <li><img align="center" style="width:150px; height: auto;" src="http://www.lehuisou.com/wp-content/uploads/2020/06/2020061512542836.jpg"></li>
                    <li>书友可以先扫码或关注公众号</li>
                    <li>获取新更书籍和网站通知</li>
                </ul>
            </div>
        </div>
        <div style="display:none;">
            <script type="text/javascript" src="https://s11.cnzz.com/z_stat.php?id=1259444303&web_id=1259444303"></script>
        </div>
        <script type="text/javascript" src="https://js.users.51.la/20820267.js"></script>
</html>