為什么背景沒(méi)有覆蓋？
<!DOCTEPY html>
<html>
<head>
<meta charset="UTF-8">
<title>春節(jié)快樂(lè)</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="music">
? ? ?<img src="123/music_pointer.png">
<img src="123/music_disc.png">
</div>
<div class="page" id="page1">
? ? ? ?<div clas="bg"></div>
? ? ? ?<div class="p1_lantern">點(diǎn)擊屏幕<br></br>開啟好運(yùn)2016</div>
? <div class="p1_dog"></div>
? <div class="p1_words">2016年神煩狗賀新年</div>
? </div>
<div class="page" id="page2">
? ? ? ?<div clas="bg"></div>
? ? ? ?<div class="p2_circle"></div>
? <div class="p2_2016"></div>
? ? ? ?</div>
? ? ? ?<div class="page" id="page3">
? ? ? ?<div clas="bg"></div>
? <div calss="p3_logo></div>
? ? ? ?<div calss="p3_title></div>
? <div calss="p3_second></div>
? <div calss="p3_first></div>
? <div calss="p3_blessing></div>
? </div>
</body>
</html>
/* all tag */
* {
margin: 0;
padding: 0
border: none;
font-size: 1.15625vw;
font-family: "Microsoft Yahei";
}
html,
body {
height: 100%;
}
/* music */
?#music {
position: fixed;
top: 3vh;
right: 4vw;
z-index: 5;
? ? ? ? width: 15vw;
? ? ? ? height: 15vw;
? ? ? ? border: 4px solid #ef1639;
border-radius: 50%;
background: #fff;
}
?#music > img:first-of-type {
position: absolute;
top: 24%;
right :2.5%
width :28.421%;
?}
?#music > img:last-of-type {
position: absolute;
top: 0;
right :0;
bottom :0;
left: 0;
margin: auto;
width: 79%;
?}
?
/* page bg */
?.page{
height: 100%;
?}
?.page > .bg{
?position: absolute;
?width: 100%;
?height: 100%;
?}
?
/* page1 */
?#page1 > .bg {
? background: url("123/p1_bg.jpg") no-repeat center center;
? background-size: 100%;
?}
/* page2 */
page2 > .bg {
? background: url("123/p2_bg.jpg") no-repeat center center;
? background-size: 100%;
/* page3 */
page3 > .bg {
? background: url("123/p3_bg.jpg") no-repeat center center;
? background-size: 100%;
2016-02-10
建議加一張圖，就是你代碼的效果，或者在runjs上弄個(gè)demo