본문 바로가기
프로그래밍 개발/CSS

CSS 플루트 (float)

by Jinseok Kim 2020. 10. 21.
반응형
  • float 이란?

 

Float는 편집 디자인에서 이미지를 삽화로 삽입할 때 사용하는 기법입니다. 또한 레이아웃을 잡을 때도 사용하는 기능이다.

clear는 float가 적용된 요소에 대하여 피해가지 않기 하기 위해서 피해가지 말라는 요소에게 적용한다.)

 

 

 

응용 실습

 

1. 삽입된 이미지에 float : right을 이용하여 float을 적용해 주었다. right 로 삽입된 이미지가 웹 페이지의 오른쪽에 위치시키도록 하였다.

2. 문장의 두번째 단락은 float가 적용된 이미지를 피해가지 말라고 단락을 구별짓는 <p> 태그 안에 clear : both을 넣어주었다.

 

 

 

clear가 적용되지 않은 첫 번째 단락은 float가 적용된 이미지를 피해 정렬된 것을 볼 수 있다.

 

반응형

댓글