좁은 브라우저에서 특정 CSS를로드하기 위해 미디어 쿼리가있는 사이트를 모바일에 최적화하도록했습니다. 그러나 사이트가 적절한 CSS가 아닌 표를 사용하여 만들어 졌음을 알았습니다. 나는 테이블을 가진 사이트를 만드는 것이 왜 끔찍한 아이디어인지 모든 이유를 알고 있지만, CSS를 사용하여 테이블을 하나의 열 레이아웃으로 나눌 수있는 방법이 있습니까?모바일 최적화 테이블 기반 웹 사이트?
이것은 힘든 작업 일 수 있습니다.
타겟팅하는 모바일 브라우저에 따라 사용 된 마크 업에 따라 다른 표가 있습니까? 올바른 레이아웃 표를 쉽게 타겟팅 할 수 있습니까? 등)에 대한 디스플레이 속성을 설정하는 것이 좋습니다. TD의 레이아웃을 차단하여 테이블의 제약 조건에서 자유롭게 할 수 있습니다.
아래의 스 니펫과 같은 CSS는 최신 모바일 브라우저에서 트릭을 수행해야하지만 가능한 경우 다른 요소에 영향을주지 않도록 의도 된 요소를보다 구체적으로 타겟팅해야합니다. 차단하기 위해 테이블 요소를 설정 한 후에
table, tr, td {
display: block;
}
, 당신은 스타일 수와 모바일 레이아웃들을 필요에 위치한다.