欢迎来到DIVCSS5查找CSS资料与学习DIV CSS布局技术！
CSS手册 CSS3手册 CSS论坛 CSS培训 CSS任务 网闻
DIVCSS5培训 系统快速学会CSS布局技术！
DIVCSS5首页 > CSS3 >

对div加float样式

对div加float名目

本色：只需要对并排div插足float名目，何况并排div总宽度小于上一级（父级）宽度便可完成。

1、加float花式实现div并排不换行实例

CSS代码如下：



    
	
  1. 
		<!DOCTYPE html>
    2. 
	
  2. 
		<html>
    3. 
	
  3. 
		<head>
    4. 
	
  4. 
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    5. 
	
  5. 
		<title>CSS5 float完成DIV并排</title>
    6. 
	
  6. 
		<style>
    7. 
	
  7. 
		.aaa1,.aaa2,.aaa3,.aaa4{ float:left} 
    8. 
	
  8. 
		/* .aaa1,.aaa2,.aaa3,.aaa4简写 感化：共用 float:left名目 */ 
    9. 
	
  9. 
		</style>
    10. 
	
  10. 
		</head>
    11. 
	
  11. 
		 
    12. 
	
  12. 
		<body>
    13. 
	
  13. 
		<div class="aaa1">我在aaa1内</div>
    14. 
	
  14. 
		<div class="aaa2">我在aaa2内</div>
    15. 
	
  15. 
		<div class="aaa3">我在aaa3内</div>
    16. 
	
  16. 
		<div class="aaa4">我在aaa4内</div>
    17. 
	
  17. 
		</body>
    18. 
	
  18. 
		</html>
    19. 




	float实现div并排实例截图



	CSS实现div float并排排成一排显示截图 CSS完成div float并排排成一排显露截图


     
如需转载，请注明文章出处和来源网址：http://www.divcss5.com/css3-style/c53780.shtml

						

						
						

							
						

						

							

								
必备CSS教程Essential CSS Tutorials

							

							

								
							

						

						

							

								
必备HTML基础教程Essential HTML Tutorials

							

							

								
							

						

					

				

				

					

						

							
最新文章 NEWS

						

						

							
						

					

					

						

							
CSS 特效 CSS EFFECTS

						

						

							
						

					

					

						

							
相关文章 RELATED

						

						

							
						

					

					

						

							
热点文章 HOT