# display

transition에 display none을 대체하여 사용하는 방법
작업을 하면서 시각적으로 요소가 변화해야 하는 상황이 생기게 되는데 초반에는 기능적인 부분만 중점으로 생각하여 transition이라는 것을 잘 사용하지 않았었다. 하지만 시각적으로도 부드럽게 변화하는 모습을 구현하기 위해 해당 속성을 사용하게 되었고, display를

display: flex
display: flex 기본 세로 정렬에서 안에 있는 내용 물을 가로로 정렬할 수 있도록 도와줌 justify-content: 종류 center 모든 요소들 중간 정렬 flex-end 마지막 정렬 flex-start 시작 정렬 space between 간격을 만
Display(Block, Inline, Inline-block)
요소를 어떻게 보여줄지를 결정block : 블록 박스inline : 인라인 박스inline-block : block과 inline의 중간 형태기본적으로 가로 영역을 모두 채움block 요소 다음 태그는 다음 줄로 변경됨 ex) header, footer, p, li,

미디어 쿼리 사용하기
미디어 쿼리 사용하기 image 미디어 쿼리 사용하기 image미디어 쿼리 사용하기 image미디어 쿼리 사용하기 image 미디어 쿼리 사용하기 image 미디어 쿼리 사용하기 image

position, display 정리
사용하면서도 항상 헷갈리던 css의 position과 display 속성에 대해서 정리한다. 요소를 한 줄로 배치하고 싶을 때 무지성으로 display: inline-block을 때려넣곤 했다. block, inline, inline-block의 차이에 대해 정확하
display 속성
inline, inline-block, block, none태그마다 기본값이 다르게 적용되어 있다.none은 요소를 렌더링 하지 않는다.visibility를 hidden과 영역을 차지하지 않는다는 것에서 차이가 있다.가로 영역을 전부 차지한다. block의 다음 태그는

[CSS] 레이아웃
콘텐츠를 웹 페이지에서 자유롭게 배치하려면 지난번에 배운 박스 모델, 콘텐츠 영역 등과 함께 레이아웃을 만들어주는 속성에 대해서도 알아야합니다. 오늘은 웹 문서 레이아웃을 만드는 속성에 대해 알아보도록 하겠습니다/display 속성은 콘텐츠 영역 포스트에서 잠깐 다뤘습

Layout
iOS 화면 업데이트는 어떻게 되는 걸까? draw, layoutIfNeeded, setNeedsLayout 등. 이해가 안가는 것들이 너무 많았다. 오늘 한번 부셔보자!
[css] inline / inline-block / block
tag에 기본적으로 display 속성 값이 지정되어 있지만 css에서 display 값 '재설정' 가능 display속성 값 중 inline / inline-block / block 에 대한 설명입니다.대표적인 inline tag : <span>, <a

CSS Layout?
페이지에 콘텐츠가 기다란 한 줄로만 나오게 하고 싶다면 아무런 레이아웃을 지정하지 않는 방법도 괜찮습니다. 하지만 사용자가 브라우저 창을 굉장히 넓게 키운다면 콘텐츠를 읽기가 굉장히 불편해질 것입니다.