在網(wǎng)頁開發(fā)中，表格是一種常見的元素，但是當(dāng)表格中的文本過長(zhǎng)時(shí)，會(huì)導(dǎo)致表格過寬超出頁面范圍，這時(shí)就需要使用 CSS 技巧來實(shí)現(xiàn)表格的斷行。

下面是一個(gè)簡(jiǎn)單的 HTML 表格，其中包含了一些很長(zhǎng)的文本內(nèi)容：

<table>
<tr>
<th>姓名</th>
<th>年齡</th>
<th>個(gè)人簡(jiǎn)介</th>
</tr>
<tr>
<td>張三</td>
<td>26</td>
<td>這是一段非常非常非常非常非常非常非常非常非常長(zhǎng)的文本內(nèi)容，超過了表格的寬度，如果不加處理，會(huì)導(dǎo)致頁面出現(xiàn)滾動(dòng)條，影響用戶體驗(yàn)。所以我們需要使用 CSS 技巧來實(shí)現(xiàn)表格的斷行，使文本自動(dòng)換行，適應(yīng)表格寬度。</td>
</tr>
</table>

為了實(shí)現(xiàn)表格的斷行，我們可以使用 CSS 的word-wrap屬性和table-layout屬性：

<style>
table {
width: 100%;
table-layout: fixed; /* 固定表格布局 */
}
td {
word-wrap: break-word; /* 自動(dòng)換行 */
}
</style>

上面的代碼中，table-layout: fixed屬性可以固定表格的布局，保證表格的單元格寬度始終一致，從而避免表格因?yàn)樘L(zhǎng)而超出頁面寬度。而word-wrap: break-word屬性可以實(shí)現(xiàn)文本的自動(dòng)斷行，使長(zhǎng)文本內(nèi)容適應(yīng)表格寬度。

實(shí)現(xiàn)表格斷行后，我們?cè)俅尾榭错撁妫梢园l(fā)現(xiàn)表格中的文本已經(jīng)自動(dòng)斷行，適應(yīng)表格寬度，而不會(huì)導(dǎo)致頁面出現(xiàn)滾動(dòng)條：