여기에서 몇 가지 질문을 조사했지만 제가 찾고 있는 문제를 완전히 해결하지는 못했습니다.

나에게 웹사이트가 있고 그것을 원한다고 가정해 보세요. 데스크탑에서 나는 이것을 원합니다:

쉽습니다. grid-template-columns: 重复(3, 33%) (기본적으로)

하지만 모바일에서는 이걸 원해요

내가 만난 일은 단일 열로 바뀌기 전에 일어났습니다.

나는 clamp()、minmax() 온갖 노력을 다하고 있지만 아무것도 내가 원하는 대로 되지 않습니다. 예, 확실히 미디어 쿼리를 사용할 수 있지만 기본 레이아웃 변경을 수행하는 데 미디어 쿼리가 필요하지 않도록 최신 CSS(예: 클램프, 그리드, minmax 등)를 사용하여 진정한 유동 그리드/플렉스 레이아웃을 만들고 싶습니다. < /p>

이것이 작동하지 않는다는 것을 알고 있지만 요청의 시작점으로 여기에 내 100번 시도 중 하나의 간단한 버전이 있습니다. :) 이 버전에서는 클램프를 사용하여 반복(3)에서 반복(1)으로 전환하려고 합니다. .

으아악 으아악