CSS 布局之分栏显示 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <style type="text/css">
	body
	{
		background:#35d2e8;
		font:normal 100% Verdana,Arial,宋体,Helvetica,sans-serif;
		margin:0px;
		padding:0px;
	}
	#content_head
	{
		background:#e05a0a;
		border:5px solid #fff;
		height:130px;
		margin:20px 20px 0px 20px;
		padding:0px;
		height:120px;
	}
	#content_head p
	{
		color:#fff;
		font-weight:bold;
		margin:10px;
		line-height:100px;
	}
	#content_left
	{
		background:#e050a0;
		border:5px solid #fff;
		margin:10px 0px 20px 20px;
		padding:0px;
		position:absolute;
		top:150px;
		left:0px;
		width:160px;
		height:450px;
	}
	#content_center
	{
		background:#e05a0a;
		border:5px solid #fff;
		margin:10px 200px 20px 200px;
		padding:0px;
	}
	#content_center div
	{
		height:450px;
		width:100%;
	}
	#content_right
	{
		background:#e05a0a;
		border:5px solid #fff;
		margin:10px 20px 20px 0px;
		padding:0px;
		position:absolute;
		top:150px;
		right:0px;
		width:160px;
		height:450px;
	}
  </style>
 </head>

 <body>
  <div id="content_head"><p>页头部分</p></div>
  <div id="content_left"></div>
  <div id="content_center">
	<div>
		
	</div>
  </div>
  <div id="content_right"></div>
 </body>
</html>

 

posted @ 2011-12-07 09:42  常伟华  阅读(910)  评论(0)    收藏  举报