散人笔记 » 网页布局

散人笔记 » 网页布局 http://www.uideas.cn 生活来源于创意,所以我懂生活 Sun, 22 Aug 2010 07:17:13 +0000 http://wordpress.org/?v=2.8.6 en hourly 1 div+css通用网页布局实例 http://www.uideas.cn/post/203.html http://www.uideas.cn/post/203.html#comments Tue, 08 Dec 2009 02:55:00 +0000 kos http://www.uideas.cn/?p=203



CODE
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <link type="text/css" rel="stylesheet" href="http://www.uideas.cn/download/div+css.css"> </head> <body> <div id="mainCov"> 	<div id="header">header</div> 	<div id="contentCov"> 		<div class="left"> 			<div class="leftCon"> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			</div> 			<div class="ad">pic</div> 		</div> 		<div class="right"> 			<p>right</p> 			<p>right</p> 			<p>right</p> 			<p>right</p> 			<p>right</p> 			<p>right</p> 			<p>right</p> 			<p>right</p> 			<p>right</p> 			<p>right</p> 			<p>right</p> 		</div> 	</div> 	<div id="footer">footer</div> </div> </body> </html> 



[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

]]> 　　直接看下面的效果,通用的网页基本上采用这个基本布局,不再为div+css实现网页布局而烦恼了!



CODE
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <link type="text/css" rel="stylesheet" href="http://www.uideas.cn/download/div+css.css"> </head> <body> <div id="mainCov"> 	<div id="header">header</div> 	<div id="contentCov"> 		<div class="left"> 			<div class="leftCon"> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			  <p>left</p> 			</div> 			<div class="ad">pic</div> 		</div> 		<div class="right"> 			<p>right</p> 			<p>right</p> 			<p>right</p> 			<p>right</p> 			<p>right</p> 			<p>right</p> 			<p>right</p> 			<p>right</p> 			<p>right</p> 			<p>right</p> 			<p>right</p> 		</div> 	</div> 	<div id="footer">footer</div> </div> </body> </html> 




[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

]]> http://www.uideas.cn/post/203.html/feed 0