개발하자(DevHaja)

FrontEnd/CSS

[CSS] display 속성 (flex)

display : flex 속성은 하나의 아이템이 자신의 컨테이너가 차지하는 공간에 맞추기 위해 크기를 키우거나 줄이는 방법을 설정하는 속성입니다. flex 속성이 적용된 container가 부모 요소인 flex container 가 되고, 하위 요소인 item은 자식 요소인 flex item 이라고 부릅니다. ✔ flex container 속성 flex-direction, flex-wrap, justify-content, align-items, align-content ✔ flex item 속성 flex, flex-grow, flex-shrink, flex-basis, order ✔ flex-direction item 요소들의 방향을 결정 하는 속성입니다. .container { flex-directi..

FrontEnd/CSS

[CSS] display 속성 (block/inline)

display 속성은 웹 페이지의 레이아웃을 결정하는 CSS의 중요한 속성 중 하나입니다. ✔ display: block; display 속성 값이 block 인 요소는 해당 라인의 모든 너비를 차지합니다. ex) , , , , , ... ✔ display: inline; display 속성 값이 inline 인 요소는 해당 라인 전체가 아닌 해당 HTML 요소의 내용만큼 차지합니다. ex) , , , , ... ✔ display: inline-block; display 속성 값이 inline-block 인 요소는 해당 요소 자체는 inline 요소처럼 동작합니다. inline 요소에서 불가능하던 width 와 height 속성 지정 및 margin 과 padding 속성 지정이 가능해집니다. ✔ dis..

devwoodie
'Display' 태그의 글 목록