<h2> 內容為長網址,超寬不換行,導致版面撐破。
<h2 style="width:300px; word-break:break-all; word-wrap:break-word">
https://s3-us-west-1.amazonaws.com/web.noblehouse/41678
</h2>
| 屬性 | 效果 |
|---|---|
word-break: break-all | 任意字元處斷行,適合中英混排、長英文/網址 |
word-wrap: break-word | 僅在單詞過長無法放入時斷行,較温和 |
white-space: pre-wrap | 保留空白與換行,並允許自動換行 |
同時設定 word-break:break-all 與 word-wrap:break-word 可覆蓋大多數瀏覽器相容性問題。