如何使用bootstrap在屏幕较大时将表控制为小尺寸？

Question

<table class="col-lg-6 table table-bordered table-hover table-condensed table-responsive" id="tab">

我把col-lg-6包含在table.Even虽然表格显示全屏

https://jsfiddle.net/DTcHh/11436/

检查上面的小提琴

Answer 1

您应该首先了解您的屏幕尺寸。 像：

1. 大屏幕（lg）屏幕尺寸为> 1170px
2. 中屏幕（md）的屏幕尺寸为> 970px至< 1170px
3. 小屏幕（sm）的屏幕尺寸为> 750px至< 970px
4. 超小屏幕（xs）的屏幕尺寸为< 750px

根据这个你可以申请这个班级 col-lg，col-md，col-sm，col-xs

Answer 2

我使用了div ..我已经写过表格代码并将col-lg-6包含在div中。它有用。

Answer 3

始终使用课程名称＆＃39;表格响应＆＃39;，它会在响应方面为您提供很多帮助。

<div class='table-responsive'>
<table class="table table-bordered table-hover table-condensed table-responsive col-lg-6" id="tab">
</div>

Answer 4

你写的代码是错误的。正确的方法是：

<table class="table table-bordered table-hover table-condensed table-responsive col-lg-6" id="tab">

你在另一个内部有一个属性，引号（"）打破了它。