当前位置:企业首页 >> 新闻中心

分享到： 更多

css之强制换行代码

发布时间:2010-09-02 19:07　点击量:

在网页开发中经常会碰到很多怪现象，下面我们看看于css教程之强制换行代码哦，这里也是很多ie兼容问题，导致全是字母时不换行了，我们就用一些方法强制换行吧。

<div id="wrap">正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义</div>
css

#wrap{white-space:normal; width:200px; }

1.（ie浏览器）连续的英文字符和阿拉伯数字,使用word-wrap : break-word ;或者word-break:break-all;实现强制断行

#wrap{word-break:break-all; width:200px;}
或者
#wrap{word-wrap:break-word; width:200px;}

<div id="wrap">abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111</div>

效果：可以实现换行

2.（firefox浏览器）连续的英文字符和阿拉伯数字的断行,firefox的所有版本的没有解决这个问题,我们只有让超出边界的字符隐藏或者,给容器添加滚动条

#wrap{word-break:break-all; width:200px; overflow:auto;}

<div id="wrap">abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111</div>

效果：容器正常，内容隐藏