例：
序号
分类A
分类B
名称
说明
*** 作……在本例中，名为“说明”的列，内容比较长，个人认为可以将此列设置为浮动宽度列，用以自适应页面的宽度。
但是当该表格中出现长度比列幅宽的半角字符时，td的宽度会被内容撑破，应该如何解决呢？解决此问题的方法是：在明细行的td中，追加style="word-wrap:break-word"，这样做可以使半角连续字符强制换行，不至于撑破列宽。
例：
……应用此方法，针对设置了width宽度的td列可以解决，但是如果没有设置宽度的td列，是无法生效还是会被撑破td的，应该如何解决呢？解决此问题的方法是：在定义表格时，追加style="table-layout:fixed"，这样做可以使半角连续字符强制换行，不至于撑破列宽。需要注意的是，使用此参数后，不要轻易在tr(行)或td(列)中加入height属性，会使table不再被内容撑出适合的高度。
例：
效果图
用jquery获取浏览器实时的宽度,然后设置table宽度<body onload="resize()" onresize="resize()">
<table>
<thead>
<th>col1</th>
<th>col2</th>
</thead>
<tbody>
<tr>
<td>我是帅哥</td>
<td>楼上说的很对</td>
</tr>
</tbody>
</table>
<script src="js/JQuery.min.js"></script>//别忘了引入JQeury的js文件
<script>
function resize() {
var width = $(document).width() //获取浏览器宽度
$("table").width(width)//设置table宽度
}
</script>
</body>
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）