작정하고 장고 - css display 속성, size 단위

12강 - CSS 핵심 - display 속성 및 Size 단위 px, em, rem, %

display 속성

block

모든 태그에는 부모가 존재하는데 부모의 모든 너비를 가져가고 블록형태를 가지는 태그

inline

글씨의 높이 만큼 한줄내에 일정 부분만 들어가는 속성을 가진 태그

inline-block

블록이지만 인라인이다(오른쪽으로 쌓임)

none

태그는 존재하지만 브라우저에 보이지 않는데

아래와 같이 적용된다 ↓

visibility-hidden

hidden과 none의 차이

size

px

부모 태그에 상관없이 고정된값

em

부모의 값이 2배가 증가하면 자신의 값도 같이 2배 증가한다.
하지만 부모가 2배증가되고 부모의 부모도 2배가 증가하면 4배 증가된다. -> 관리에 어려움이 있음

rem

root html의 font-size가 늘어난 비율만큼 자신의 값도 변한다.

%

바로 부모위의 크기만 받는다.

정리

주로 rem과 %를 사용한다.