龙盟编程博客 | 无障碍搜索 | 云盘搜索神器
快速搜索
主页 > web编程 > div+css/html >

css之强制换行代码(1/2)

时间:2012-12-31 10:44来源:未知 作者:admin 点击:
分享到:
在网页开发中经常会碰到很多怪现象,下面我们看看于css之强制换行代码哦,这里也是很多ie兼容问题,导致全是字母时不换行了,我们就用一些方法强制换行吧。 在网页开发中经常会
在网页开发中经常会碰到很多怪现象,下面我们看看于css之强制换行代码哦,这里也是很多ie兼容问题,导致全是字母时不换行了,我们就用一些方法强制换行吧。

在网页开发中经常会碰到很多怪现象,下面我们看看于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>

效果:容器正常,内容隐藏

1 2

精彩图集

赞助商链接