본문 바로가기

HTML

[CSS ] display: flex 속성
old 2021. 3. 10. [CSS ] display: flex 속성 flex Container: 문서의 영역 중에서 flexbox가 놓여있는 영역 flex Container 생성 방법: 컨테이너 요소의 display 값을 flex 혹은 inline-flex로 지정 이 값이 지정된 컨테이너의 일차 자식이 flex item이 됩니다 Container에서 사용 가능한 속성: display, flex-flow, justify-content Items에서 사용 가능한 속성: order, flex, align-self flex 속성 기본값은 아래와 같습니다. 항목은 행으로 나열됩니다. (flex-direction: row) 항목은 주축의 시작 선에서 시작합니다. 항목은 주 차원 위에서 늘어나지는 않지만 줄어들 수 있습니다. 항목은 교차축의 크기를 채우기 위해 늘어납니다. flex-..
[HTML] 블록 요소
old 2021. 2. 27. [HTML] 블록 요소 HTML 안의 요소는 크게 "블록 요소(block eliment)와 "인라인 요소(inline eliment)"로 구분할 수 있다. 사실 이런 이진적 분류는 HTML 4.01이 사용되던 2014년 이전까지 사용됐는데, inline 요소와 block 요소의 조합은 HTML5의 플로우 콘텐츠에 대응된다. 블록 요소는 너비와 높이를 가져 공간을 차지하여 "블록"을 만든다. CSS 태그인 vertical-align, text-align이 적용되지 않는다. 인라인 요소는 블록 레벨 안쪽에서 텍스트를 꾸미는 태그다. CSS에서 너비(width)와 높이(height)를 가지지 않는다 블록 요소는 CSS 태그인 display: inline을 이용해 inline 속성으로 변경할 수 있다. 블록 태그는 새로운 줄에서 시작..

티스토리툴바