html让一个文案自动换行,使用word-wrap:break-word使文本自动换行

使用word-wrap:break-word使文本自动换行

文章作者：网友投稿　发布时间：2010-07-14 15:08:24　来源：网络

文本框连续输入 数字111111111111111111或者 英文单词adkjsakfjsalfkjsalkdjaslkfjsalkf 会造成什么结果呢?---文字溢出,一般的处理方法是用overflow:hidden隐藏文字,有没有更好的解决文案呢?QA的童鞋要求自动换行. 用word-wrap:break-word即可 css手册上的解释 word-wrap 基

文本框连续输入

数字"111111111111111111"或者

英文单词"adkjsakfjsalfkjsalkdjaslkfjsalkf"

会造成什么结果呢?---文字溢出,一般的处理方法是用overflow:hidden隐藏文字,有没有更好的解决文案呢?QA的童鞋要求自动换行.

用word-wrap:break-word即可

css手册上的解释

word-wrap

基本特性

兼容性： IE5.5+专有属性

基本语法

word-wrap : normal | break-word

语法取值

normal: 默认值。允许内容顶开指定的容器边界

break-word:内容将在边界内换行。如果需要，词内换行( word-break )也将发生

使用说明

设置或检索当当前行超过指定容器的边界时是否断开转行。此属性仅作用于有布局的对象，如块对象。内联要素要使用该属性，必须先设定对象的 height 或 width 属性，或者设定 position 属性为 absolute ，或者设定 display 属性为 block 。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。对应的脚本特性为 wordWrap 。

w3c的解释

http://www.w3.org/TR/css3-text/#word-wrap