用CSS解决强制不换行问题

1、在固定宽度的div中,如果出现一长串没有空格的字母,且长度超过div的设定宽度,此时浏览器会把这一长串字母当作一个单词,默认为单行显示,或者撑开外部容器或者超越外部容器。针对这种情况的解决办法如下:
在CSS中做下列定义
#container { word-break: break-all; width: 450px; }
便可以让超长串字母在外部容器边缘换行了。但其为IE私有属性,FF,OPERA等浏览器都是不支持的,而且直接用无法通过标准验证,所以可用IE注释方法解决。
至于 FF目前只能够在长字段中插入
来解决,使其在wbr处强制换行。且单个即可,无需关闭标签。

2、在固定宽度的div中,无论是超长串字母还是带空格的句子,强制不换行,溢出部分隐藏。
在CSS中定义如下:
#container{ width: 450px; overflow: hidden; white-space: nowrap; }
此时溢出部分默认被简单隐藏,还可加上
text-overflow: ellipsis;
,当对象内文本溢出时显示省略标记“...”,但该语句仅对IE有用,FF下仍旧是简单隐藏。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值