index.html
<!DOCTYPE html>
<html>
<head>
<title>王大膽</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="description" content="王大膽真的是~~~" />
<meta name="keywords" content="王巖，王大膽，一個美麗又安靜的女子，" />
<link rel="apple-touch-icon-precomposed" href="/1.jpg">
<link rel="icon" href="/1.jpg">
<link rel="stylesheet" href="/i.css">
</head>
<body>
<div class="container">
<header id="header" class="clearfix">
<h1 id="logo" class="left">
<a href="/">王大膽</a>
</h1>
<nav id="nav" class="right">
<ul>
<li><a class="active" href="/" >首頁</a>
</li>
<li><a href="http://jiashengbo.cn" >ME</a>
</li>
</ul>
</nav>
</header>
<section class="page">
<div align="center">
<script language="JavaScript" type="text/javascript">
tips = new Array(15);
tips[15] = '<a href="#"><img src="0.jpg" border="0" /></a>';
tips[0] = '<a href="#"><img src="1.jpg" border="0" /></a>';
tips[1] = '<a href="#"><img src="2.jpg" border="0" /></a>';
tips[2] = '<a href="#"><img src="3.jpg" border="0" /></a>';
tips[3] = '<a href="#"><img src="4.jpg" border="0" /></a>';
tips[4] = '<a href="#"><img src="5.jpg" border="0" /></a>';
tips[5] = '<a href="#"><img src="6.jpg" border="0" /></a>';
tips[6] = '<a href="#"><img src="7.jpg" border="0" /></a>';
tips[7] = '<a href="#"><img src="8.jpg" border="0" /></a>';
tips[8] = '<a href="#"><img src="9.jpg" border="0" /></a>';
tips[9] = '<a href="#"><img src="10.jpg" border="0" /></a>';
tips[10] = '<a href="#"><img src="11.jpg" border="0" /></a>';
tips[11] = '<a href="#"><img src="12.jpg" border="0" /></a>';
tips[12] = '<a href="#"><img src="13.jpg" border="0" /></a>';
tips[13]= '<a href="#"><img src="14.jpg" border="0" /></a>';
tips[14] = '<a href="#"><img src="15.jpg" border="0"/></a>';
index = Math.floor(Math.random() * tips.length);
document.write(tips[index]);
</script>
<br><br><br>
Emmmmmmmmmm
<br><br>
你吃飽了嗎
</div>
</section>
//調用兩首歌曲
<audio autoplay="autoplay">
<source src="0.0.mp3" type="audio/mpeg">
<source src="song.mp3" type="audio/mpeg">
</audio>
<footer id="footer" class="clearfix">
<div class="by"><a href="http://www.miitbeian.gov.cn/" target="_blank">京ICP備17031512號</a></div>
</footer>
</div>
//百度
<script>
var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?3a60d5fadee01548d450064f1a212cae";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
//51啦
<script type="text/javascript" src="//js.users.51.la/19750847.js"></script>
</body>
</html>
1.css
*{margin:0;padding:0}
body,html{height:100%}
body{margin:0;background: #fff fixed repeat;color: #9a9090;font-family:Lucida Console,Consolas,Microsoft Yahei,monospace,serif;}
video{position:fixed;right:0;bottom:0;z-index:-100;width:auto;height:auto;min-width:100%;min-height:100%;background-size:cover}
@media screen and (max-width:500px){video{margin-right:-552px}
}
h1,h2,h3,h4,h5,h6{font-weight:400}
a{text-decoration:none}
a,a:hover{color: #ff2e88;}
a:hover{background:#000}
.container{margin:0 auto;max-width:50pc}
.clearfix:after,.clearfix:before{display:table;content:""}
.clearfix:after{clear:both}
.left{float:left}
.right{float:right}
.by{color:#fff;text-align:center;font-size:15px}
img{width:444px;border-radius:8px}
#header a{display:block;border-bottom:0;color:inherit;line-height:70px}
#header a:hover{background:0 0;color:#ff2e88}
#logo a{color: #000;font-size:20px;}
#logo a span{margin:0 5px}
#nav ul{list-style:none}
#nav li{display:inline-block;margin-left:20px}
#nav a.active{color:#ff2e88}
#banner{margin-bottom:40px;padding:25px;border-radius:2px;background:linear-gradient(#181818,#000);color:#999}
#banner h2{margin-bottom:5px;color:#fff;font-weight:700;font-size:20px}
#banner h3{margin-top:15px;margin-bottom:5px;color:#ccc;font-size:inherit}
#main .article{margin-bottom:40px}
table{margin:0 auto;width:100%;border-collapse:collapse;border-radius:8px;border-spacing: 0;}
table th{text-align:left;font-weight:400}
table td,table th{padding:10px 15px}
table td:first-child{width:15pc;color: #0a0000;}
table td:nth-child(2){width:140px;color:#ccc}
.page{padding:40px 75pt 5pc;min-height:calc(100vh - 230px);border-radius:8px;line-height:20px;}
.page h2{margin-bottom:30px;color:#000;text-align:center;font-size:22px}
.page h3{margin-top:30px;color:#fff;font-size:1pc}
.page h3,.page ol,.page p,.page ul{margin-bottom:10px}
.page ol,.page ul{padding-left:20px}
.page ul{list-style:square}
.page li{margin-bottom:5px}
#footer{margin-bottom:15px;color:#666;line-height:25px}
@media only screen and (max-width:900px){.container{padding-right:15px;padding-left:15px}
img{width:100%;border-radius:8px}
.left,.right{float:none}
#header{padding:25px 0 20px}
#header a{line-height:40px}
#logo,#nav{text-align:center}
#nav li{margin:0 10px}
table td:first-child,table td:nth-child(2){width:auto}
.page{padding:20px;min-height:calc(100vh - 280px)}
.page h2{margin-bottom:20px;text-align:left}
.page h3{margin-top:20px}
.f{position:fixed;top:0;left:0;z-index:-1;width:100%;height:100%;background-position:top center;background-size:cover}
}
