文本超过div 自动换行代码

文本超过div 自动换行代码文本自动换行IE中解决方法:

word-wrap:break-word;
word-break:break-all;
注:在要换行的内容相应的单元格或者DIV里加入,如:

<div style=word-wrap:break-word;></div>或<td style=word-wrap:break-word;></td>
文本自动换行FireFox中解决方法(脚本):

<script type="text/javascript">
function toBreakWord(intLen, id){
var obj=document.getElementById(id);
var strContent=obj.innerHTML;
var strTemp="";
while(strContent.length>intLen){
strTemp+=strContent.substr(0,intLen)+"<br>";
strContent=strContent.substr(intLen,strContent.length);
}
strTemp+= strContent;
obj.innerHTML=strTemp;
}
</script>
注:以上脚本放在</head>前面.

调用时如下写法:

同个页面单处调用:

<div id="content">这里是要应用换行的内容</div><script language="javascript">toBreakWord(60, "content");</script>
同个页面多处调用:

<div id="content">这里是要应用换行的内容</div><script language="javascript">toBreakWord(60, "content");</script>
<div id="content2">这里是要应用换行的内容</div><script language="javascript">toBreakWord(60, "content2");</script>
注:把应用的JS写在</div>后面,其中60表示一行要显示多少字字符,注意多个调用时ID的相应变化,不能同一个ID名称,应用上面的方法后IE也会是按设定的字符数换行,但是IE里面支持自动换行,所以只要判断一下是否为IE,如果不是IE就不要输出上面的

<script language="javascript">toBreakWord(60, "content");</script>
这段JS,如果不是就要输出。

时间: 2024-10-12 15:33:17

文本超过div 自动换行代码的相关文章

CSS3文本换行word-wrap解决英文文本超过固定宽度不换行

英文文本超过固定宽度,不会自己换行的问题想必大家都有碰到过吧,在以前是用overflow:hidden或者JavaScript来控制,当CSS3出现的时候,我们就可以用CSS3之文本换行word-wrap来解决这个问题了   大家在制作的时候有时候会碰到英文文本超过固定宽度,不会自己换行的问题.这种问题以前解决的时候大多都用overflow:hidden或者 JavaScript来控制,让其看起来接近完美.当CSS3出现的时候,我们就可以用CSS3之文本换行word-wrap来解决这个问题了.下

如何使文本在DIV+CSS布局中垂直居中

css DIV+CSS布局中垂直居中的实现. <html><head><style>body{TEXT-ALIGN: center;}#center{ MARGIN-RIGHT: auto;MARGIN-LEFT: auto;height:200px;background:#F00;width:400px;vertical-align:middle;line-height:200px;}</style></head><body><

Flex Label自动截取、自动换行代码

Flex Label经常会使用到它的自动截取.自动换行代码如下,感兴趣的朋友可以参考下哈,希望对大家有所帮助   复制代码 代码如下: label.maxDisplayedLines=0; // 默认多行显示,不截取 label.maxDisplayedLines=1; //任意整数,显示单行文本,自动截取(...) label.maxDisplayedLines=2; //撑满label,可多行,显示不了的截取(...)

怎么让css不自动换行代码

浮动层加margin后换行的例子: 比如说有个DIV宽度为380px,它里面有一个菜单列表,每个宽度为60px,margin-right为20px.如果就按照下面的HTML结构来做的话,那么这个菜单列表能在这个DIV里一行显示完整吗? <div>      <div>mb5u1</div>      <div>mb5u2</div>      <div>mb5u3</div>      <div>mb5u4&l

绝对居中的层div+css代码示例

绝对居中的层div+css代码示例 以下是代码:<html> <head> <title>Nice and Free CSS Template 11</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <style type="text/css"><!--

jquery 实现定时显示与隐藏div广告代码

 html页面中我们随便放些东西 代码如下 <div class="toolbarframe" style="display:none;"><a href="http://www.45it.net" target="_blank"><img src="/upfile/swf/s.jpg" /></a><a class="bigad_close&

JS文本获得焦点清除文本文字的示例代码

 本篇文章主要是对JS文本获得焦点清除文本文字的示例代码进行介绍,需要的朋友可以过来参考下,希望对大家有所帮助 如下所示:    代码如下: <!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.o

div布局-怎样在记事本中显示div隐藏代码

问题描述 怎样在记事本中显示div隐藏代码 我在做大数据可视化,用的JavaScript Infovis Toolkit,正在看官网给的例子,可是用记事本打开,有一部分div代码没有显示出来,我想修改那些没有被显示出来的代码,,怎么让他们在记事本或Dreamweaver里显示出来啊,,,求大神回复~ 解决方案 Java 记事本代码div 显示与隐藏div隐藏和显示

列表框文字显示不下,可不可以像文本框那样自动换行?

问题描述 列表框文字显示不下,可不可以像文本框那样自动换行? 列表框文字显示不下,可不可以像文本框那样自动换行?怎么给列表框加上wordwarp属性? 解决方案 你是不是设置了overflow:hidden了,要不碰到边界会自动换行的