DivCSS教程:CSS控制Table單元格強制換行與強制不換行_Div+CSS教程
教程Tag:暫無Tag,歡迎添加,賺取U幣!
Div CSS教程:CSS控制Table單元格強制換行與強制不換行
我們知道Div的換行和不換行的css寫法。但對于表格單元格只知道一個屬性nowrap可以使其不換行。
近日有此需要,但發現加上nowrap在某些情況下還是會換行!無奈,沒有一個強制不換行的方法嗎?
用CSS實現Table單元格數據自動換行或不換行的實現方法:
1、強制換行:
2、強制不換行:
我們知道Div的換行和不換行的css寫法。但對于表格單元格只知道一個屬性nowrap可以使其不換行。
近日有此需要,但發現加上nowrap在某些情況下還是會換行!無奈,沒有一個強制不換行的方法嗎?
用CSS實現Table單元格數據自動換行或不換行的實現方法:
1、強制換行:
示例代碼 [www.zhaotila.cn]
<style type="text/css">
.AutoNewline
{
word-break: break-all;/*必須*/
}
</style>
<table>
<tr>
<td class="AutoNewline">自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行</td>
</tr>
</table>
.AutoNewline
{
word-break: break-all;/*必須*/
}
</style>
<table>
<tr>
<td class="AutoNewline">自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行自動換行</td>
</tr>
</table>
2、強制不換行:
示例代碼 [www.zhaotila.cn]
<style type="text/css">
.NoNewline
{
word-break: keep-all;/*必須*/
}
</style>
<table>
<tr>
<td class="NoNewline">不換行不換行不換行不換行不換行不換行不換行不換行不換行不換行</td>
</tr>
</table>
.NoNewline
{
word-break: keep-all;/*必須*/
}
</style>
<table>
<tr>
<td class="NoNewline">不換行不換行不換行不換行不換行不換行不換行不換行不換行不換行</td>
</tr>
</table>
相關Div+CSS教程:
- 相關鏈接:
- 教程說明:
Div+CSS教程-DivCSS教程:CSS控制Table單元格強制換行與強制不換行
。