CSS 07_float

float 속성의 기본 5가지 값 

---

• HTML 요소에 float이 적용되면 HTML 요소는 원래의 흐름에서 벗어나 둥둥 떠다니듯 배치가 되고 이에 따라 인접한 텍스트 또는 inline 요소가 그 주위를 자연스럽게 감싸게 됨
• none : 기본값으로 요소를 띄우지 않음
• left : 요소를 왼쪽에 띄움
• right : 요소를 오른쪽에 띄움
• inherit : float 속성을 부모 요소로부터 상속받음
• initial : 기본값으로 설정함
  • left 또는 right을 가장 자주 사용한다.

 

clear 속성

---

• float 속성을 적용하면 그 다음 요소들은 계속해서 float 속성이 적용된 요소를 둘러싸게 되는데 이러한 상황을 벗어나기 위해서는 clear 속성을 적용하면 된다.
• clear : none => 기본값
• clear : right => 오른쪽을 취소
• clear : left => 왼쪽을 취소
• clear : both => 왼쪽 오른쪽 둘 다 취