[css] grid 반응형 layout 적용 grid를 이용한 반응형 레이아웃 입니다. grid를 이용한 style을 적용하면, 미디어쿼리를 사용할 필요 없이 스크린 화면 사이즈에 맞추어 반응형 레이아웃을 구현할 수 있습니다. 구현 화면 css div { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); grid-gap: 15px; } fr fr(fractional unit)은 사용 가능한 공간에 대한 비율을 의미 아래의 경우 100px, 25%를 사용하고 남은 공간을 1fr은 ‘1/3’, 2fr은 ‘2/3’ 만큼 사용 .container { grid-template-columns: 1fr 2fr 100px 25%; } auto-fill 행과 열의 크기게 맞게 .. 이전 1 다음 반응형