文字排版詞條 3-45

文字截斷Text Truncation

也常叫做:截斷、省略、Truncate

你可能會這樣說

後台輸入的標題長度不一,有的兩行有的五行,卡片高度被撐開,整排卡片高低不齊、按鈕到處跑。

白話解釋

文字截斷是超過固定行數就裁掉、結尾補刪節號(…)的技巧:標題限兩行、摘要限三行,版面就能鎖死高度、整齊劃一。

它最常用在清單與卡片這種「同款大量重複」的結構——內容長度不可控,但版面要可控。文章列表的摘要也常截斷,再加一個「閱讀更多」連到全文。

跟 AI 指定時要講清楚「幾行」:單行截斷與多行截斷的寫法不同,只說「太長就刪」會得到不可預測的結果。

親手試試

✕ 沒有截斷
短標題
摘要一行。
這是一個落落長的商品標題因為賣家把所有規格都寫進去了還包括買一送一
摘要也很長很長很長很長很長很長很長很長很長。
↑ 兩張卡不一樣高,底下的按鈕到處亂跑
✓ 限行數+刪節號
短標題
摘要一行。
這是一個落落長的商品標題因為賣家把所有規格都寫進去了還包括買一送一
摘要也很長很長很長很長很長很長很長很長很長。
↑ 標題限一行、摘要限兩行,卡片鎖死同高

標題限一行、摘要限兩行,超出就截斷加刪節號;被截斷的完整內容用提示訊息或「閱讀更多」補上。

圖 3-45 截斷讓長短不一的內容,乖乖裝進一樣高的卡片。

這樣對 AI 說

中文就可以
請幫卡片加上文字截斷:
標題最多兩行、摘要最多三行,超出就截斷並顯示刪節號。
被截斷的卡片高度保持一致,按鈕永遠貼齊底緣。
文章列表的單行標題超出寬度也截斷。
滑鼠停留時,用提示訊息顯示完整標題。

同一課的其他詞