whatisthis?

CSS float 속성 본문

WEB STUDY/HTML,CSS

CSS float 속성

thisisyjin 2021. 9. 3. 19:53

 

 

float - CSS: Cascading Style Sheets | MDN

CSS 속성(property) float 은 한 요소(element)가 보통 흐름(normal flow)으로부터 빠져 텍스트 및 인라인(inline) 요소가 그 주위를 감싸는 자기 컨테이너의 좌우측을 따라 배치되어야 함을 지정합니다.

developer.mozilla.org

float

 

CSS 속성(property) float 은 한 요소(element)가 보통 흐름(normal flow)으로부터 빠져

텍스트인라인(inline) 요소가 그 주위를 감싸는 자기 컨테이너의 좌우측을 따라 배치되어야 함을 지정합니다.

 

 

float: none; (초기값)
float: left;
float: right;

부동(floating) 요소 = float 의 계산값(computed value)이 none이 아닌 요소

 

float 은 블록 레이아웃의 사용을 의미한다.

/* 키워드 값 */
float: left;
float: right;
float: none;
float: inline-start;
float: inline-end;

/* 전역 값 */
float: inherit;
float: initial;
float: unset;
inline-start는 요소가 자신의 포함 블록의 시작쪽에 부동함을 나타내는 키워드입니다.
즉, ltr(left to right) 스크립트 상에서 왼쪽 /
그리고 rtl(right to left) 스크립트 상에서는 오른쪽.
inline-end는 요소가 자신의 포함 블록의 끝쪽에 부동함을 나타내는 키워드입니다.
즉, ltr 스크립트 상에서 오른쪽 / 그리고 rtl 스크립트 상에서는 왼쪽.