jquery - 在调整大小时隐藏表 td

Question

table td当我调整窗口大小或屏幕尺寸很小时，我想隐藏一些。我试过 CSSmedia queries

th:nth-last-child(-n+7) {display:none}
td:nth-last-child(-n+7) {display:none}
th:last-child {display:none}
td:last-child {display:none}

它可以工作，但 CSS 不能计算 td，所以如果一个表只有三个td，那么上面的代码隐藏所有三个td。请帮助我使用 jQuery 实现这一点：td 在调整大小或屏幕尺寸很小时隐藏，

1. 如果屏幕宽度为 768px，则仅显示六个td并从右侧隐藏其他

2. 如果屏幕宽度为 480 像素，则仅显示四个td并从右侧隐藏其他

3. 如果屏幕宽度为 320 像素，则仅显示三个td并从右侧隐藏其他

Answer 1

改为使用:last-child和max-width媒体查询。

td:nth-child(n+7)只会影响从连续第七个单元格开始的单元格，td:nth-child(n+5)只会影响从连续第五个单元格开始的单元格，依此类推。

@media (max-width:768px) {
    td:nth-child(n+7),th:nth-child(n+7) {display:none}
}
@media (max-width:480px) {
    td:nth-child(n+5),th:nth-child(n+5) {display:none}
}
@media (max-width:320px) {
    td:nth-child(n+4),th:nth-child(n+4) {display:none}
}

http://jsfiddle.net/mblase75/GsxPK/