Bootstrap响应式表格

通过把任意的 .table 包在 .table-responsive class 内,您可以让表格水平滚动以适应小型设备(小于 768px)。当在大于 768px 宽的大型设备上查看时,您将看不到任何的差别。

<div class="table-responsive">
  <table class="table table-responsive table-hover">
    ...
  </table>
</div>

Firefox 和 fieldset 元素

Firefox 浏览器对 fieldset 元素设置了一些影响 width 属性的样式,导致响应式表格出现问题。除非使用我们下面提供的针对 Firefox 的 hack 代码,否则无解:

@-moz-document url-prefix() {
  fieldset { display: table-cell; }
}

参考:

http://w3c.3306.biz/bootstrap_table/show-24-54-1.html

猜你喜欢

转载自halfsking.iteye.com/blog/2332248