CSS实现表格单元格强制换行和强制不换行
以前总结过Div的换行和不换行的css写法。但对于表格单元格只知道一个属性white-space:nowrap可以使其不换行。
近日有此需要,但发现加上nowrap在某些情况下还是会换行!无奈,没有一个强制不换行的方法吗?
baidu了一下,令俺非常欣慰,还真的找到了办法,问题解决了。
实现方法(原文copy过来):
======================================
引用
用CSS实现表格单元格数据自动换行或不换行
1、自动换行:
<style type="text/css">
.AutoNewline
{
word-break: break-all;/*必须*/
}
</style>
<table>
<tr>
<td class="AutoNewline">自动换行自动换行自动换行自动换行自动换行自动换行
自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行
自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行自动换行</td>
</tr>
</table>
2、不换行:
<style type="text/css">
.NoNewline
{
word-break: keep-all;/*必须*/
}
</style>
<table>
<tr>
<td class="NoNewline">不换行不换行不换行不换行不换行不换行不
换行不换行不换行不换行</td>
</tr>
</table>
注:使用word-break:keep-all时,如果单元格宽度不够,则还是会强制换行;此时可使用white-space:nowrap