table中td内容自动换行

网页开发过程中时常会遇到关于折行和不折行的问题。

比如连续英文或符号时,即使定义了宽度,文本还是没法折行,因为没有字符、字母里间隔的话,会当成一个单词。所以按不能折行来解析。

这时如果遇到了链接url,往往全是连续的英文和字母,这样就会把原本做好的页面搅乱。

而有的时候,我们希望强制不折行,或者某一链接不折行,或者折行时链接一起折行,而不会出现链接里两个字有断开的折行。

 

table-layout:   fixed          按照你定义的表格宽度或列宽显示数据,不受内容本身宽度影响。

 

1.(IE支持)

关键词:table-layout:   fixed   及   word-wrap:   break-word  

<table style="table-layout:fixed" width="200" bgcolor="#f7f7f7">

//是否自动换行

   <tr>     

<td   style="word-wrap:break-word">  //一个很长的单词遇到换行要拆开

AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA     </td>   

 </tr>    

</table>

 

2.(Firefox 或其他浏览器支持)

/* Browser specific (not valid) styles to make preformatted text wrap */ 

pre {

 white-space: pre-wrap;       /* css-3 */

 white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */

 white-space: -pre-wrap;      /* Opera 4-6 */

 white-space: -o-pre-wrap;    /* Opera 7 */

 word-wrap: break-word;       /* Internet Explorer 5.5+ */

}

3.(Firefox支持)

<td><script language="javascript" type="text/javascript" defer="defer">javascript:(function(){var D=document; F(D.body); function F(n){var u,r,c,x; if(n.nodeType==3){ u=n.data.search(/\S/); if(u>=0) { r=n.splitText(u+10); n.parentNode.insertBefore(D.createElement("WBR"),r); } }else if(n.tagName!="STYLE" && n.tagName!="SCRIPT"){for (c=0;x=n.childNodes[c];++c)} } })();</script></td>

4.(IE5以下)

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值