PageAdmin新版采用了Html5的文档类型声明(即:<!DOCTYPE html>),会发现只在table中增加强制换行样式style="word-break:break-all;"已经不管用了。
解决办法:增加white-space和word-wrap(如果不用这个,英文或数字长字符串不会强制换行),完整的样式如下:
<table .. style="word-wrap:break-word;word-break:break-all;white-space:normal;">
....
<td style="width:150px;overflow:hidden"> 注意,td里面一定要加上宽度限制
这样设置后在火狐和IE下td里面的内容都会在超过固定宽度后强制换行。
word-break:break-all和word-wrap:break-word都是能使其容器如DIV的内容自动换行。 它们的区别就在于: 1,word-break:break-all 例如div宽200px,它的内容就会到200px自动换行,如果该行末端有个英文单词很长(congratulation等),它会把单词截断,变成该行末端为conra(congratulation的前端部分),下一行为tulation(conguatulation)的后端部分了。 2,word-wrap:break-word 例子与上面一样,但区别就是它会把congratulation整个单词看成一个整体,如果该行末端宽度不够显示整个单词,它会自动把整个单词放到下一行,而不会把单词截断掉的。
定义和用法
white-space 属性设置如何处理元素内的空白。
这个属性声明建立布局过程中如何处理元素中的空白符。值 pre-wrap 和 pre-line 是 CSS 2.1 中新增的。
默认值: | normal |
---|---|
继承性: | yes |
版本: | CSS1 |
JavaScript 语法: | object.style.whiteSpace="pre" |
可能的值
值 | 描述 |
---|---|
normal | 默认。空白会被浏览器忽略。 |
pre | 空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。 |
nowrap | 文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。 |
pre-wrap | 保留空白符序列,但是正常地进行换行。 |
pre-line | 合并空白符序列,但是保留换行符。 |
inherit | 规定应该从父元素继承 white-space 属性的值。 |