그것은 수사학적이지 않습니다. 저는 CSS 다중 열 레이아웃에 대한 훌륭한 사용 사례를 찾는 데 정말로 관심이 있습니다.
대답은 간단해 보입니다. 콘텐츠를 열로 분할하려면 열을 사용하십시오. 맞습니까? 다음은 일반적으로 우리 자신을 포함하여 CSS 다중 열 레이아웃이 작동하는 방식을 보여주는 기사에서 찾을 수 있는 종류의 예입니다. 달력:
바로. 그러나 이것이 실제 사용 사례입니까? 음 아마. 텍스트가 비교적 짧다면 아마도 좋은 터치일 것입니다. 그것이 내가 웹사이트를 재설계할 때 나 자신에게 판매한 방법입니다. 몇년 전. 오늘날은 그렇지 않지만 당시의 모습은 이렇습니다.
그러나 전체 긴 형식의 기사가 열로 분할됩니까? 나는 신문에서 그것을 좋아하지만 한 열을 읽기 위해 웹 페이지를 아래로 스크롤하는 것을 주저하고 다시 위로 스크롤하기만 하면 됩니다.
두 요소를 나란히 배치하는 데 사용할 수 있다고 생각하지만 flexbox가 더 적합합니다. 또한 제한 사항으로 인해 열을 선택하여 개별적으로 크기를 조정할 수 없습니다. 열의 너비는 같아야 합니다.
열이 가지고 있는 한 가지는 열이 다음과 같은 유일한 CSS 레이아웃 방법이라는 것입니다. 파편 콘텐츠. (즉, 계산하지 않는 한 CSS 영역... 어쨌거나 그것들은 어떻게 되었습니까?!) 따라서 단락을 열로 분할하려는 경우 추가 래퍼 없이 이미 가능합니다.
연속적인 콘텐츠 블록을 열로 분할해야 하는 경우는 또 언제입니까? 주문되지 않은 항목의 큰 목록이 있을 때 그렇게 해야 했던 기억이 납니다. 나는 목록이 콘텐츠를 쉽게 스캔할 수 있도록 하는 방식을 좋아하지만 목록이 길면 페이지의 한 면이 너무 무거워 보일 수 있습니다. 예를 들어 CSS-Tricks에 대한 모든 게시물 태그를 알파벳 그룹으로 나열한다고 가정해 보겠습니다. 다중 열 레이아웃은 다음과 같이 훌륭하게 작동합니다.
계속해서 뷰포트 너비의 크기를 조정해 보십시오. 세 개의 열이 정의되지만 사용 가능한 공간의 양에 따라 숫자가 변경됩니다. 미디어 쿼리 작업 없이 반응이 좋은 모든 것을 좋아해야 합니다!
나는 데모를 위해 일하고 있었다 :left 의사 클래스 및 도달 columns 데모 인쇄를 위해 조각화하는 좋은 방법이기 때문입니다. 그래서 다른 사용 사례가 있다고 생각합니다. 데모를 만드는 동안 여러 열 레이아웃을 사용하여 이미지 갤러리와 같은 항목의 벽돌 그리드를 만들 수 있다는 것을 깨달았습니다.
그러나 다른 것은 무엇입니까? 우리는 짧은 단락, 긴 목록 및 자유롭게 흐르는 그리드로 제한되어 있습니까?
