CSS3를 사용하여 목록 항목을 열로 표시하는 방법은 무엇입니까?

CSS3 열이 있는 열로 목록 항목 표시

화면 크기에 따라 목록을 행이나 열로 표시할 수 있나요? 이는 반응형 웹 디자인에서 흔히 발생하는 문제입니다. 테이블은 옵션이지만 CSS3은 columns 속성을 사용하여 더욱 우아한 솔루션을 제공합니다.

다음은 HTML 구조의 예입니다.

이러한 목록 항목을 열로 표시하려면 다음 CSS를 추가하세요. :

결과는 표시된 대로 목록 항목의 3개 열이 됩니다.

열 개수를 변경하려면 열 개수 값을 조정하세요. 응답성을 위해 미디어 쿼리를 사용하여 화면 크기에 따라 1열 레이아웃과 다중 열 레이아웃 간에 전환할 수 있습니다.

위 내용은 CSS3를 사용하여 목록 항목을 열로 표시하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!