我想问一下,为什么内容的宽度太大,为什么不固定宽度th,而不换行呢?现在,使th的宽度扩大。如何解决?我的第一列宽度:col-lg-2。
如果您在标题中使用列,则表格的其余部分将遵循该模式,直到大小为止。
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<h1>With Columns</h1>
<table class="table table-bordered">
<thead>
<tr class="danger">
<th class="col-lg-2">col-lg-2 - Row Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's. industry. Lorem Ipsum has been the industry's.</th>
<th class="col-lg-3">col-lg-3 - Row</th>
<th class="col-lg-4">col-lg-4 - Row</th>
<th class="col-lg-3">col-lg-3 - Row</th>
</tr>
</thead>
<tbody>
<tr>
<td>1 Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's. he printing and typesetting industry. Lorem Ipsum has been t</td>
<td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.</td>
<td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.</td>
<td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.</td>
</tr>
<tr>
<td>2 Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.</td>
<td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.</td>
<td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.</td>
<td>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's. Lorem Ipsum is simply
dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's.</td>
</tr>
</tbody>
</table>
<hr>
<h1>Without Columns</h1>
<table class="table table-bordered">
<thead>
<tr class="info">
<th>Row fasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasd</th>
<th>Row</th>
<th>Row</th>
<th>Row</th>
</tr>
</thead>
<tbody>
<tr>
<td>1.asdsadasdadasdad</td>
<td>John.</td>
<td>Carter.</td>
<td>[email protected].</td>
</tr>
<tr>
<td>1.asdsadasdadasdad</td>
<td>John.</td>
<td>Carter.</td>
<td>[email protected].</td>
</tr>
</tbody>
</table>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句