六狼论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

新浪微博账号登陆

只需一步,快速开始

搜索
查看: 90|回复: 0

长串英文数字强制折行问题

[复制链接]

升级  8.33%

67

主题

67

主题

67

主题

举人

Rank: 3Rank: 3

积分
225
 楼主| 发表于 2013-1-29 07:30:46 | 显示全部楼层 |阅读模式
DIV+CSS:长串英文数字强制折行问题

在网站实际应用中,经常会遇到英文数字长串后不折行的bug,利用CSS可以解决这个问题。

< style type=”text/css”>
< !–
div {
width:300px;
word-wrap:break-word;
border:1px solid red;
}
–>
< /style>
< div>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa…..< /div>

< script type=”text/javascript”>
// < ![CDATA[
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>

火狐下利用js解决

white-space: pre; /* CSS2 */white-space: -moz-pre-wrap; /* Mozilla */white-space: -hp-pre-wrap; /* HP printers */white-space: -o-pre-wrap; /* Opera 7 */white-space: -pre-wrap; /* Opera 4-6 */white-space: pre-wrap; /* CSS 2.1 */white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */word-wrap: break-word; /* IE */
您需要登录后才可以回帖 登录 | 立即注册 新浪微博账号登陆

本版积分规则

快速回复 返回顶部 返回列表