반응형 테이블 TH, TD 숨기기
본문
안녕하세요.
반응형은 잘 몰라서 질문 올립니다.
사실은 많은 분야 모르는 짜집퍼라...
화면이 작아지면 예를 들어 가로 768PIXEL 이하이면 사진에 빨간색 사각형 친 한국 프리미엄 부분 TH와 TD 부분을 지우거나 안보이게 하고 싶습니다.
@media all and (max-width:768px) {) 안에 어떻게 해야 하나요?
화면이 좁아지니 한부분을 안보이게 하는거죠.
CSS 파일 어떻게 수정해야 할까요?
읽어 주셔서 고맙습니다.
답변 4
해당 td th에 class를 준다음에
미디어쿼리안쪽에서 해당 class를 display:none 을 주시면 될거 같습니다.
질문하기전부터 해봤는데
tr의 th는 안보이는데 tr의 td는 계속 보이네요,
어제 질문하기전에는 안되더니 심야에 되네요.
분명 display:none; 일것 같았지만 안되고 구글 검색도 해보고 했는데요.
안될때 캐시도 지워봤고요.
여하튼 안되다 나중에 되는거 보니 황당하지만 여하튼 다행입니다.
답변 고맙습니다.
th 와 td에 각각 클래스를 주셔야 합니다. display:none 하시면 되고요 ..안되면 !important 붙여보시고요
저때 한번이라면 last-child 를 쓰시는 건 어떤가요?
:last-child{display:none}
이런식은 어떤가요??
말씀하신대로 한국프리엄에 해당하는 th,td 부분에 클래스명을 뿥이시고 display:none을 하셔도 되고,
애초에 테이블자체를 반응형으로 수정하는 것도 가능합니다.
부트스트랩의 경우 반응형 테이블은 가로스크롤이 가능하게 만들어버려서 숨기지 않고 스크롤하면서 보게 해놓습니다.