<div class="table-responsive"> <table class="table"> ... </table> </div>
此代码块不会导致Bootstrap中的响应表。请帮助我使用引导来实现响应表。
提前致谢
解决方法
以下响应表仅适用于< 768px。
<div class="table-responsive">
<table class="table">
</table>
</div>
因为引导3具有以下代码
@media (max-width: 767px) {
.table-responsive {
width: 100%;
margin-bottom: 15px;
overflow-y: hidden;
overflow-x: scroll;
-ms-overflow-style: -ms-autohiding-scrollbar;
border: 1px solid #DDD;
-webkit-overflow-scrolling: touch;
}
}
如果您需要响应表显示> 768px，那么您可以在您的css中覆盖它，而不需要像这样的媒体查询
.table-responsive {
width: 100%;
margin-bottom: 15px;
overflow-y: hidden;
overflow-x: scroll;
-ms-overflow-style: -ms-autohiding-scrollbar;
border: 1px solid #DDD;
-webkit-overflow-scrolling: touch;
}