Twitter中的响应表处理Bootstrap [英] Responsive table handling in Twitter Bootstrap

问题描述

当表格的宽度超过span的宽度时，如下所示： http://jsfiddle.net/rcHdC/

When a table's width exceed the span's width, like this page: http://jsfiddle.net/rcHdC/

您将看到表的内容在 span 之外。

You will see the table's content is outside of the span.

什么是最好的方法来满足这种情况？

What would be the best method to cater this case?

推荐答案

Bootstrap 3 现在有响应表开箱即用。 Hooray！ ：）

Bootstrap 3 now has Responsive tables out of the box. Hooray! :)

您可以在这里查看： http：// getbootstrap。 com / css /＃tables-responsive

添加< div class =table-responsive> 周围的表，你应该很好去：

Add a <div class="table-responsive"> surrounding your table and you should be good to go:

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

要使其适用于所有布局，您可以执行此操作：

To make it work on all layouts you can do this:

.table-responsive
{
    overflow-x: auto;
}

这篇关于Twitter中的响应表处理Bootstrap的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！