每次插入loooong评论时,如何阻止我的桌子增加宽度?
我做了一个简单的例子:
<!DOCTYPE html>
<html>
<body>
<table width='350' border="0" align="center" cellpadding="3" cellspacing="1" class="table">
<tr>
<th id="row_style" bgcolor='#D6D6D6'>ID</th>
<th id="row_style" width= "50%" bgcolor='#D6D6D6'>Content</th>
<th id="row_style" bgcolor='#D6D6D6'>Date</th>
</tr>
<tr>
<td id="row_style" bgcolor='#3399FF' scope='col' width='50'>Example</td>td>
<td id="row_style" width ='10%'> Content</td>td>
<td id="row_style" bgcolor='#3399FF' scope='col' width ='10%'>Example</td>td>
<td width ='10%'></td>
</tr>
</table>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
当我增加"内容"这个词时,表格的宽度正在增加..我怎么能阻止它并插入一个换行符?
use*_*135 12
您可以通过设置表格的宽度来完成此操作,也可以使用
word-wrap:break-word;
Run Code Online (Sandbox Code Playgroud)
为了防止真正的长话突破界限.
宽度最好在css中设置:
编辑:包括
table-layout:fixed;
Run Code Online (Sandbox Code Playgroud)
演示
http://jsbin.com/atonut/1/edit
table {
width:500px;
table-layout:fixed;
}
td {
word-wrap:break-word;
}
Run Code Online (Sandbox Code Playgroud)
如果你的问题是很多文本,而不是长得令人难以置信的长话,那么只使用宽度,然后留下自动换行.希望有所帮助.