본문 바로가기
[CSS] Flex 속성 먼저 MDN Document를 읽는다. CSS - flex 속성은 보통 "Flexible Box"라고 읽는다. https://developer.mozilla.org/ko/docs/Web/CSS/flex flex - CSS: Cascading Style Sheets | MDN flex CSS 속성은 하나의 플렉스 아이템이 자신의 컨테이너가 차지하는 공간에 맞추기 위해 크기를 키우거나 줄이는 방법을 설정하는 속성입니다. developer.mozilla.org "display : flex" 속성은 하나의 플렉스 아이템이 자신의 컨테이나거 차지하는 공간에 맞추기 위해 크기를 키우거나 줄이는 방법을 설정하는 속성이다. 기본적으로 플렉스 아이템은 콘텐츠의 최소 너비 미만으로 줄어들지 않는다. min-width, m.. 2022. 1. 15.
[CSS] Grid 속성 포트폴리오 클론 코딩 후 코드 분석중 display : grid 속성을 발견하고 관련된 내용을 알아보았다. 수학의 정석과 같은 MDN document를 읽었다. https://developer.mozilla.org/ko/docs/Web/CSS/CSS_Grid_Layout/Basic_concepts_of_grid_layout Basic concepts of grid layout - CSS: Cascading Style Sheets | MDN CSS 그리드 레이아웃(Grid Layout)은 CSS에 2차원의 그리드 시스템을 도입했습니다. 그리드는 주요 페이지 영역을 설계하거나 작은 사용자 인터페이스 요소를 배치하는 데 사용할 수 있습니다. 이 문 developer.mozilla.org GRID는 말 그대로 .. 2022. 1. 14.
[CSS] CSS의 7가지 단위 - 링크 CSS의 7가지 단위에 대한 설명이 잘 되어 있는 블로그 글이다. 출처: https://webclub.tistory.com/356 [Web Club] 2022. 1. 12.
[CSS] display 속성 (화면 배치 방법) block, inline display 속성에 대해 알기 전에 아래 내용을 알아야 한다. HTML 태그는 "블록 레벨 요소"와 "인라인 레벨 요소"로 구분지을 수 있다. 종류 태그 블록 레벨 태그 , ~ , , , , , , , , , 인라인 레벨 태그 , , , , , , , , , 그럼 "블록 레벨 요소"와 "인라인 레벨 요소"는 무엇일까. 블록 레벨 요소 블록 레벨 요소는 태그를 사용해 요소를 삽입했을 때 혼자 한 줄을 차지하는 요소 인라인 레벨 요소 줄을 차지하지 않는 요소 Display 속성을 사용하면 블록 레벨 요소를 인라인 레벨 요소로 바꾸거나 인라인 레벨 요소를 블록 레벨 요소로 바꿀 수 있다. display : none | contents | block | inline | inline-block | table |.. 2022. 1. 11.

티스토리툴바