<html>
<head>
<title>全屏页面切换</title>
<style type="text/css">
html, body {
padding: 0;
margin: 0;
height: 100%;/*html标签的100%是必须的*/
}
#container, .section {
height: 100%;
}
#section0 {
background-color: red;
}
#section1 {
background-color: white;
}
#section2 {
background-color: blue;
}
#section3 {
background-color: yellow;
}
</style>
</head>
<body>
<div id="container">
<div id="section0" class="section"></div>
<div id="section1" class="section"></div>
<div id="section2" class="section"></div>
<div id="section3" class="section"></div>
</div>
</body>
</html>
<html>
<head>
<title>全屏页面切换</title>
<style type="text/css">
html, body {
padding: 0;
margin: 0;
height: 100%;/*html标签的100%是必须的*/
}
#container, .section {
height: 100%;
}
#section0 {
background-color: red;
}
#section1 {
background-color: white;
}
#section2 {
background-color: blue;
}
#section3 {
background-color: yellow;
}
.left{
float: left;
}
#container {
width: 400%;
}
.section {
width: 25%;
}
</style>
</head>
<body>
<div id="container" class="left">
<div id="section0" class="section left"></div>
<div id="section1" class="section left"></div>
<div id="section2" class="section left"></div>
<div id="section3" class="section left"></div>
</div>
</body>
</html>