[CSS] - display

 

🗣 display 속성 :

웹 페이지의 레이아웃(layout)을 결정하는 CSS의 중요한 속성 중 하나

이 속성은 해당 HTML 요소가 웹 브라우저에 언제 어떻게 보이는가를 결정

대부분의 HTML 요소는 display 속성의 기본값으로 다음 두 가지 값 중 하나의 값을 가짐

 

1. 블록(block)

2. 인라인(inline)

 

1. block : <div>의 기본값, 한줄에 하나씩 들어가는 상자(css 설정값 주면 적용됨)

*block은 원래 width 100% 채워지므로 width 100%값 줄필요 없음(padding 값 제외하고도 알아서 가로폭 꽉참)

 

 

 

2. inline : <span>의 기본값, 한줄에 span안의 내용에 따라 여러개 들어감(css 설정값 무시)

 

 

3. inline-block : 한줄에 여러개 들어가는 상자