div+css布局技术漫谈

	

		

			

				
以下是引用片段：

					body { 

					    margin: 0; 

					    padding-left: 200px;    /* LC fullwidth */ 

					    padding-right: 190px;   /* RC fullwidth + CC padding */ 

					    min-width: 200px;       /* LC fullwidth + CC padding */ 

					    } 

					

					.column { 

					    position: relative; 

					    float: left; 

					    } 

					

					#center { 

					    width: 100%; 

					    } 

					

					#left { 

					    width: 200px;           /* LC width */ 

					    right: 200px;           /* LC fullwidth */ 

					    margin-left: -100%; 

					    } 

					

					#right { 

					    width: 190px;           /* RC width */ 

					    margin-right: -100%; 

					    } 

					

					

					    /*** IE Fix ***/ 

					* html #left { 

					    left: 190px;            /* RC fullwidth */ 

					    }
			
		
	

两行三列 

xhtml:

	

		

			

				
以下是引用片段：

					
					这里是顶行
					
 


					
					

					    
					 

					    
					这里是第一列
					
 


					    
					这里是第二列
					
 


					    
					
					
 


					    
					
 


					    
					这里是第三列
					
 


					    
					
					
 


					
					
 
			
		
	

CSS:

	

		

			

				
以下是引用片段：

					#header{width:100%; height:auto;} 

					#wrap{ width:100%; height:auto;} 

					#column{ float:left; width:60%;} 

					#column1{ float:left; width:30%;} 

					#column2{ float:right; width:30%;} 

					#column3{ float:right; width:40%;} 

					.clear{ clear:both;} 
			
		
	

三行三列

xhtml:

	

		

			

				
以下是引用片段：

					
					这里是顶行
					
 


					
					

					    
					 

					    
					这里是第一列
					
 


					    
					这里是第二列
					
 


					    
					
					
 


					    
					
 


					    
					这里是第三列
					
 


					    
					
					
 


					
					
 


					
					这里是底部一行