如何具体显示nth-child中的某些列?
How to specifically display certain columns in nth-child?
我有这个 css 我从另一个网站试过的代码:
@media only screen and (max-width: 800px) {
#data tr > * {display: none}
#data tr > *:nth-child(12) ~ * {display: table-cell}
}
但此代码仅显示第 13 列和其他列并隐藏第 [1-12] 列。当我在移动设备上访问我的网页时如何显示特定的列?例如,我想在移动设备中只显示 4 列:columns(1,28,29,97)。有没有办法专门显示column(1,28,29,97)?
尝试类似的操作:
https://jsfiddle.net/h9z6hLjv/
只需将 class showMob
添加到您要为移动设备显示的列中。调整 window 的大小以查看媒体查询是否生效。
我有这个 css 我从另一个网站试过的代码:
@media only screen and (max-width: 800px) {
#data tr > * {display: none}
#data tr > *:nth-child(12) ~ * {display: table-cell}
}
但此代码仅显示第 13 列和其他列并隐藏第 [1-12] 列。当我在移动设备上访问我的网页时如何显示特定的列?例如,我想在移动设备中只显示 4 列:columns(1,28,29,97)。有没有办法专门显示column(1,28,29,97)?
尝试类似的操作:
https://jsfiddle.net/h9z6hLjv/
只需将 class showMob
添加到您要为移动设备显示的列中。调整 window 的大小以查看媒体查询是否生效。