代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>实例2</title>
<style>
#container{
width: 1000px;
background-color: #98F5AD;
}
#header{
height: 100px;
}
#main{
height: 1000px;
background-color: #09F;
}
#footer{
height: 100px;
}
#right{
float: right;
width: 800px;
height: 1000px;
background-color: #BBFFFF;
}
#left{
float: left;
width: 200px;
height: 1000px;
background-color: #0099FF;
}
#up{
width: 500px;
height: 200px;
background-color: #0099FF;
margin:10px;
}
#mid{
width: 500px;
height: 200px;
background-color: #CCFF99;
padding: 10px;
}
#down{
width: 500px;
height: 200px;
border-style: solid;
background-color: #FF9999;
border-top-width: 10px;
border-right-width: 10px;
border-bottom-width: 10px;
border-left-width: 10px;
border-top-color: #0CF;
border-right-color: #C3C;
border-bottom-color: #06C;
border-left-color: #F00;
}
</style>
</head>
<body>
<div id=container>
<div id=header> </div>
<div id=main>
<div id=right>
<div id=up> 我有margin值</div>
<div id=mid> 我有padding值</div>
<div id=down> 我有border值</div>
</div>
<div id=left>我是左边</div>
</div>
<div id=footer> </div>
</div>
</body>
</html>
免责声明:以上内容源自网络,版权归原作者所有,如有侵犯您的原创版权请告知,我们将尽快删除相关内容。