效果示範代碼:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>firefox-break-word</title> <style type="text/css"> <!--/*--><![CDATA[/*><!--*/ #break {border:1px solid #ccc;padding:.4em .8em;width:200px;word-wrap:break-word;word-break:break-all;} /*]]>*/--> </style> </head> <body> <div id="break"> If there were less sympathy in the world, there would be less trouble in the world. ( O. Wilde ) </div> <script> function toBreakWord(intLen){ var obj=document.getElementById("ff"); var strContent=obj.innerHTML; var strTemp=""; while(strContent.length>intLen){ strTemp+=strContent.substr(0,intLen)+""; strContent=strContent.substr(intLen,strContent.length); } strTemp+=""+strContent; obj.innerHTML=strTemp; } if(document.getElementById && !document.all) toBreakWord(37) </script> </body> </html>
[Ctrl+A 全選 注:如需引入外部Js需重新整理才能執行]
CSS控制強制換行/強制換行
強制不換行
div{
white-space:nowrap;
}
自動換行
div{
word-wrap: break-word;
word-break: normal;
}
強制英文單詞斷行
div{
word-break:break-all;
}