HTML/CSS 简单布局01

来源：互联网发布：淘宝拍摄工作室编辑：程序博客网时间：2024/05/22 07:55

刚开始学习HTML/CSS 第一节简单的布局

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN">
<head>
<title>布局01</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<script type="text/javascript">

</script>

<style type="text/css">
#container{
   width:1300px;
   background:gray;
}
#header{
   height:120px;
   background:red;
}
#main{
   height:600px;
   background:green;
}
#left{
   float:left;
   width:900px;
   height:600px;
   background:pink;
}
#right{
   float:right;
   width:400px;
   height:600px;
   background:purple;
}
#footer{
   height:120px;
   background:yellow;
}
</style>
</head>
    <body>
    <div id=container>
       <div id=header></div>
       <div id=main>
           <div id=left></div>
           <div id=right></div>
       </div>
       <div id=footer></div>
    </div>
    </body>
</html>

0 0