1. 보이기 유형의 지정
ㅇ { display : 값; } : 값에 따라 요소에 다양한 표현 유형 효과를 달리 지정 가능
- inherit : (기본값) 요소 부모로부터 상속 받은 display 속성
- block : 요소를 박스화시켜,
. 위아래에 줄바꿈이 일어나도록 함
. width,height 속성 및 margin,padding 상하 속성 적용 가능
- inline : 요소들을 같은 줄에 표시함으로써,
. 폭,높이 및 상하 여백 조정 불가
- inline-block : 요소들을 같은 줄에 표시하되,
. 폭,높이 및 상하 여백 조정이 가능토록 함
- none : 요소가 페이지에서 완전히 사라지도록 함
. 토글 (toggle : show/hide) 효과를 줄 수 있음
- table
. (border-spacing, border-collapse, border-style)
- table-row
- table-cell
- flex (Flexible Box)
. container, item 이라는 2개의 관계로 시작함
. container 속성 : display, flex-flow, justify-content 등
. item 속성 : order, flex, align-self 등
- grid (그리드 레이아웃)
. (... 편집중 ...)
ㅇ { visibility : 값; } : 값에 따라 화면 표시 여부 지정
* (visibility : visible 기본값, hidden, collapse)
- visibility는 display:none과 달리,
. block 박스(차지하는 공간)는 살아있고, 그 내용 만 보이기/숨김 임