`
jialisoft126
  • 浏览: 34002 次
  • 性别: Icon_minigender_1
  • 来自: 上海
最近访客 更多访客>>
社区版块
存档分类
最新评论

css中文本换行属性word-wrap和white-space

阅读更多
今天碰到了td文字内容不换行,发现是:white-space: nowrap,即强制文本不进行换行,顺便看了一下文本换行的属性word-wrap,总结如下:
 
white-space的默认只是normal,自动换行。
 
word-break:break-all和word-wrap:break-word表示强制换行,前者若英文字符过长自动截断,后者整个英文单词会换行!
 
而而我常会这样用:
 
word-wrap:break-word; overflow:hidden;
 
IE 下没有任何问题,在 FF 下,长串英文会被遮住超出的内容
 
table中td.th强制换行方法:
 
<table style="table-layout:fixed" width="200">
<tr>
<td width="25%"  style="word-break : break-all; overflow:hidden; ">站长网www.software8.co原创教程</td>
<td width="75%" style="word-wrap : break-word; overflow:hidden; ">站长网www.software8.co原创教程</td>
</tr>
</table>
分享到:
评论

相关推荐

    css文本换行属性word-wrap和white-space使用总结

    今天碰到了td文字内容不换行,发现是:white-space: nowrap,即强制文本不进行换行,顺便看了一下文本换行的属性word-wrap,总结如下: white-space的默认只是normal,自动换行。 word-break:break-all和word-wrap:...

    css中强制换行word-break、word-wrap、white-space区别实例说明

    复制代码代码如下:”c1″&gt;...全是中文的情况。全是中文的情况。&lt;/div&gt;&lt;div class=c1&gt;中英文混排的情况。Chinese and English. 中英文混排的情况。Chinese and English.&lt;/div&gt;

    英文强制换行css 使用css强制英文单词断行代码

    复制代码代码如下:{ word-wrap: break-word; word-break: normal; } 强制英文单词断行复制代码代码如下:{ word-break:break-all; } CSS设置不转行: overflow:hidden 隐藏 white-space:normal 默认 pre 换行

    CSS控制文字换行、裁剪

    关于换行、裁剪的一些CSS属性 word-wrap: normal | break-word normal 正常换行,内容可以撑破容器,例如长单词或者长数字的情况break-word 以单词作为换行依据,如果需要,单词内部允许断行 word-break: normal | ...

    CSS实现连续数字和英文的自动换行的方法

    &lt;div id=wrap&gt;正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义&lt;/div&gt; css#wrap{white-space:normal; width:200px; } 1.(IE浏览器)连续的英文字符和阿拉伯数字,使用word-wrap : break...

    css之自动换行实现代码

    space:normal,当定义的宽度之后自动换行 html &lt;div id=wrap&gt;正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义&lt;/div&gt; css #wrap{white-space:normal; width:200px; } 1.(IE浏览器)...

    CSS强制中英文换行与不换行 强制英文换行示例

    word-wrap:break-word; 只对英文起作用,以单词作为换行依据 3. white-space:pre-wrap; 只对中文起作用,强制换行 4. white-space:nowrap; 强制不换行,都起作用 5. white-space:nowrap; overflow:hidden; text-...

    对于div,p等块级元素css如何实现自动换行

    复制代码代码如下: ”wrap”&gt;正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义&lt;/div&gt; css 复制代码代码如下: #wrap{white-space:normal; width:200px; } 1.(IE浏览器)连续的英文...

    css是如何实现在页面文字不换行、自动换行、强制换行的方法

    word-wrap: break-word; word-break: normal; } 强制英文单词断行 div{ word-break:break-all; } CSS设置不转行: overflow:hidden 隐藏 white-space:normal 默认 pre 换行和其他空白字符都将受到保护 nowrap 强制...

    css自动换行 防止撑破div影响排版

    对于div,p等块级元素正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义的宽度之后自动换行html&lt; id&gt;正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义&lt;...

    CSS网页布局强制换行和强制不换行的属性讲解

    在CSS网页布局中,常常会遇到这样的问题,强制文字换行,而不是在一... }自动换行p.www_jb51_com{  word-wrap:break-word; word-break:normal; }强制英文单词断行p.www_jb51_com{  word-break:break-all; } CS

    强制换行与强制不换行攻略

    我们一般控制换行所用到的CSS属性一共有三个:word-wrap; word-break; white-space。这三个属性可以说是专为了文字断行而创造出来的。首先我们得知道这三个属性到底是做什么用地: word-wrap语法: word-wrap: ...

    基于javascript的在火狐里面强制换行字符

    [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]CSS控制强制换行/强制换行 强制不换行 div{ white-space:nowrap; } 自动换行 div{ word-wrap: break-word; word-break: normal; } 强制英文单词断行 div{ word-break...

    html pre标签使文本自动换行

    使用&lt;pre&gt;&lt;/pre&gt;标签,并设置其样式如下: .../*Opera7*/ word-wrap:break-word;/*InternetExplorer5.5+*/ }  该CSS方案可让pre标签内的文本自动换行,我在我有的浏览器上都测试了一下,全部支持,IE6,IE7,IE8,Fi

    CSS 数字和字母将容器撑大问题解决

    space:normal,当定义的宽度之后自动换行 html &lt;div id=wrap&gt;正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义&lt;/div&gt; css #wrap{white-space:normal; width:200px; } 1.(IE浏览器)...

    css控制文字自动换行的实现方法

    正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义的宽度之后自动换行 html 正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义 css CSS Code复制内容到...

    CSS强制性换行的方法区别详解

    一般情况下,元素拥有默认的white-space:normal(自动换行,PS:不换行是white-space:nowrap),当录入的文字超过定义的宽度后会自动换行,但当录入的数据是一堆没有空格的字符或字母或数字(常规数据应该不会有吧,...

    css表格单元格中的长文本如何实现自动换行

    复制代码代码如下: ”wrap”&gt;正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义&lt;/div&gt; css 复制代码代码如下: #wrap{white-space:normal; width:200px; } 1.(IE浏览器)连续的英文...

Global site tag (gtag.js) - Google Analytics