讓長字元自動換行(例如URL 和Email位址) 目的:讓很長的字串,能自動換行,但是不要把短的單字從中間斷開。
方法如下:
- < style >
- div{
- width:300px;overflow:hidden;/* for FF,Opera ,固定寬度;隱藏多餘的字元*/
- word-wrap:break-word;word-break:normal;/* for IE,Safari ,支援自動換行*/
- }
- style >
|
你可以在IE,Firefox,Opera,Safari裡面分別運行下面的程式碼,看看:
- < style type = "text/css" >
- div{width:200px;background:red;overflow:hidden;word-wrap:break-word;word-break:normal;}
- style >
- < div > congratulations
- 讓長字元自動換行 (例如 URL 和 Email位址):
- http://www.div-css.com/html/standard/base/81857.html
- SDFG SOME word has spacing...
- XXXXXXXXXXXXDGXXXXXXXXYYYYDFGYYXXXXXXXSDGXXXXXXXXXXXXyXXXXXXXXXXxwhite-space: nowrap
- 一些中文字體一些中文字體一些中文字體一些中文字體一些中文字體一些中文字體,可能不會換行
- Web標準化< a href = "http://www.div-css.com" _fcksavedurl = "http://www.div-css.com" > www.div-css.com a >
- 中文文字 中文文字 中文文字 中文english文字 中文文字 中文english文字 中文english文字 中文english文字 中english字 中english字 中english字 中english字
- div >
|
另外,關於網上所說的用js來讓長字符串在Firefox裡面自動換行的方法,不推薦使用,原因是換行之後得到的字符串,已非本來的字符串了,比如要是一個鏈接地址的話,你再去複製,你已經得不到原來的地址了,中間會出現一個空格。那已經是另外的連結了。