float이란?
- '뜨다'
- 웹페이지에서 요소를 띄우는 방법으로, 요소가 기본 레이아웃의 흐름에서 벗어나 페이지의 왼쪽이나 오른쪽에 부유하도록 설정하는 것
float 속성
- none: 기본 속성, 요소를 띄우지 않는다.
- left: 요소를 왼쪽으로 띄운다.
- right: 요소를 오른쪽으로 띄운다.
float 취소 (clear)
float을 사용하면 다른 요소들까지 영향을 받을 수 있다. 이럴 때, 영향을 주고 싶지 않은 부분은 clear 속성을 활용해 해제할 수 있다.
- clear:left 왼쪽 해제
- clear:right 오른쪽 해제
- clear:both 양쪽 해제
실습
오른쪽 실행결과: 0.5배로 봐야 함
See the Pen Untitled by 챈챈 (@naaoviji-the-animator) on CodePen.