html – 使用Bootstrap 3如何隐藏表格中的列？

概述在col-xs和col-sm中，我正试图为响应式设计隐藏列。我首先尝试使用hidden-xs / hidden-sm类，但这不起作用。我也试过使用这里提到的可见桌面： Twitter Bootstrap Responsive – Show Table Column only on Desktop 这也行不通。做这个的最好方式是什么？我宁愿不做两个单独的表然后隐藏其中一个。 我尝试过的代码目前无效： 在col-xs和col-sm中，我正试图为响应式设计隐藏列。我首先尝试使用hIDden-xs / hIDden-sm类，但这不起作用。我也试过使用这里提到的可见桌面： Twitter Bootstrap Responsive – Show Table Column only on Desktop

这也行不通。做这个的最好方式是什么？我宁愿不做两个单独的表然后隐藏其中一个。

我尝试过的代码目前无效：

<table>    <thead>        <th>Show All the time</th>        <th >HIDe in XS and SM</th>    </thead>    <tbody>        <tr>            <td>Show All the time</td>            <td >HIDe in XS and SM</td>        </tr>    </tbody></table>

解决方法 代码应该可以正常工作。 bootstrap支持使用其响应实用程序类 https://github.com/twbs/bootstrap/blob/master/less/mixins.less#L504隐藏/显示th和td：

// Responsive utilitIEs// -------------------------// More easily include all the states for responsive-utilitIEs.less..responsive-visibility() {  display: block !important;  tr& { display: table-row !important; }  th&,td& { display: table-cell !important; }}.responsive-invisibility() {  display: none !important;  tr& { display: none !important; }  th&,td& { display: none !important; }}

该代码适用于此Jsfiddle：http://jsfiddle.net/A4fQP/

总结

以上是内存溢出为你收集整理的html – 使用Bootstrap 3如何隐藏表格中的列？全部内容，希望文章能够帮你解决html – 使用Bootstrap 3如何隐藏表格中的列？所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。