<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html"; charset="utf-8" />
<meta name="description" content="首页布局">
<title>实战首页布局</title>
<style>
#container{
width:1002px;
background-color:gray;
margin-left: 280px;
}
#header{
height:120px;
background-color:orange;}
#main{
height:600px;
background-color:green;}
#lside{
width:700px;
float:left;
height:600px;
background-color:pink;}
.four{
width: 300px;
height: 260px;
background-color: black;
float: left
<html>
<head>
<meta http-equiv="content-type" content="text/html"; charset="utf-8" />
<meta name="description" content="首页布局">
<title>实战首页布局</title>
<style>
#container{
width:1002px;
background-color:gray;
margin-left: 280px;
}
#header{
height:120px;
background-color:orange;}
#main{
height:600px;
background-color:green;}
#lside{
width:700px;
float:left;
height:600px;
background-color:pink;}
.four{
width: 300px;
height: 260px;
background-color: black;
float: left