float left clear both

1345 단어 float
이 문제를 해결하려면 3개의 DIV를 설정하면 간단합니다.
 
<body>
	<div style="height: 200px; width: 200px; background-color: red;float: right;">
		    
	</div>
	
	
	<div style="height: 200px; width: 200px;background-color: gray; clear: left; ">
		    
	</div>
	
	
	<div style="height: 200px; width: 200px;background-color: green;float: right;">
		    
	</div>


</body>

1. 어떤 원소가float:left로 변할 때 두 가지 작용이 있다. 첫째, 이 원소는 앞의 원소의 왼쪽에 떠 있다(전제는 앞의 원소가 행내 원소이다).둘째, 이 원소는 블록 내 원소가 되고 다른 원소는 같은 줄에 있을 수 있다.
 
2. 만약에 앞의 원소가float:left라면 뒤의 원소는 강제로 윗줄로 끌려갈 것이다. 이때 올라가고 싶지 않으면clear:left를 사용하면 된다. 이 말은 왼쪽에 부동원소가 있으면 왼쪽이 덩어리원소라고 생각하고 자신이 줄을 바꾼다는 뜻이다. 
 
 
 
 
 
 
 
 
 
 
 
css를 전문적으로 설명하는 사이트:
refurl: http://zh.html.net/tutorials/css/lesson13.php
 
  http://www.w3school.com.cn/cssref/pr_class_float.asp
 
 

좋은 웹페이지 즐겨찾기