모바일 보기에 테이블 열을 쌓는 것이 내 목표입니다.

Question

열이 5개 있고 코딩하기 가장 쉬운 방법이기 때문에 테이블로 만들겠습니다.

모바일 보기에 겹쳐서 표시하고 싶습니다. 어떻게 해야 하나요?

내 형식은:

으아아아 으아아아

어떤 도움이라도 대단히 감사하겠습니다. 콘텐츠 클래스를 100% 너비로 설정하기 위해 미디어 쿼리를 사용해 보았습니다. 가능하다면 겹쳐서 보관하고 싶습니다. 내가 어디서 잘못되었는지 잘 모르겠습니다.

테이블 방식 이전에 Flexbox를 사용해 보았지만 화면 크기가 변경되면 높이 문제가 발생했습니다. 이 작업이 더 쉬웠지만 모바일 반응형으로 만드는 방법을 모르겠습니다. 실제 테이블이 아니기 때문에 조금 혼란 스럽습니다.

Answer 1

현재 데스크톱 설정이 마음에 든다면 가장 쉬운 방법은 위의 모든 CSS를 블록 수준 요소인 @media 查询中以适应更大的屏幕。就像 @media (min-width: 768px) { ... all your CSS } - 这样，移动设备上的任何内容都不会受到这些样式的影响。默认情况下，div로 래핑하는 것입니다. 이는 100% 스택 가능합니다.

으아아아 으아아아