当前位置:首页 > Css

div中英文无法自动换行的解决方法

happyfhb17年前 (2010-01-22)Css2677
摘要:问题:在一个设定好宽度的div中,当我们输入的中文文字长度超过了设定宽度时,会自动换到下一行。但是,如果输入的是英文字母,那么,无论你div设定宽度为多少,英文字母都是不换行直接在同一行输出,导致div的宽度远远超出设定的大小。原因:这是因为div中,英文字母之间没有空格的话,它会默认认为这是一个英…

问题:

在一个设定好宽度的div中,当我们输入的中文文字长度超过了设定宽度时,会自动换到下一行。但是,如果输入的是英文字母,那么,无论你div设定宽度为多少,英文字母都是不换行直接在同一行输出,导致div的宽度远远超出设定的大小。


原因:这是因为div中,英文字母之间没有空格的话,它会默认认为这是一个英文单词,所以单词就一次输出不换行。那么,难道我们得在每个字母中间加入一个空格来解决这个问题么?其实不用的,可以通过CSS实现。


解决办法:在div的style中设定word-break:break-all;即可实现自动换行。添加后的div代码大致如下


<div style="word-break:break-all;width:20px“ >现在这里的英文达到20px长度就会自动换到下一行了</div>
 

扫描二维码推送至手机访问。

版权声明:本文由海海日记-冯海滨博客发布,如需转载请注明出处。

本文链接:http://www.fenghaibin.com/?id=487

“div中英文无法自动换行的解决方法” 的相关文章

最简单的tab菜单效果

最简单的tab菜单效果以前自己不会的时候总觉得别人做的tab菜单很高深看不懂里面的代码 可是自己真正去研究的时候发现也就是那么回事。下面把我做的按列拿上来 共大家参考。在配合一些css美化才漂亮,这里只是演示。几乎所有的tab菜单都是基于此原理的。下面是代码。大家可以研究下。 function tr…

鼠标放上去点击图片

鼠标放上去点击图片

 鼠标放上去点击图片.rar 非常好的css样式。…

纯div+Css下拉菜单

纯div+Css下拉菜单

 纯div+Css下拉菜单 请在下方下载经典下拉菜单.rar …

父级div height:auto无效解决办法

一种可能情况因为父div中的div处于浮动状态。浮动是会脱离文档流的,内部两个层就不会局限于父层。所以父层不知道内部的高度。但清理浮动,可以把他们“拉”回来。…

100% width CSS 在 iPad / iPhone Safari 背景被截断 / 显示不全

最近在做一个页面时,发现在 iPad 的 Safari 浏览器中背景显示不全,定位到该 div 后发现所指定 css 的宽度为 100% ; 到百度搜索后发现,safari 中&nbs…

css如何让表格table的边框为1像素

在Html中使用table是网页制作中必不可缺的一部分,如果直接给css设置table里面的td边框为1像素的话,那么实际我们从网页上看到的效果却不是1像素。那么我们怎么用css让table的边框为1像素呢?其实很简单,给table使用css样式 border-collapse: collapse;…

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。