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>

 

你可能感兴趣的:(css)