首页前端开发JavaScripthtml怎么设置文字超出换行

html怎么设置文字超出换行

时间2024-01-29 20:45:03发布访客分类JavaScript浏览440
导读:收集整理的这篇文章主要介绍了html怎么设置文字超出换行,觉得挺不错的,现在分享给大家,也给大家做个参考。htML中可通过word-wrap、word-break和overflow属性设置文字超出换行,只需给文字元素添加“word-wrap...
收集整理的这篇文章主要介绍了html怎么设置文字超出换行,觉得挺不错的,现在分享给大家,也给大家做个参考。

htML中可通过word-wrap、word-break和overflow属性设置文字超出换行,只需给文字元素添加“word-wrap:break-word; word-break:break-all; overflow:hidden; ”样式。

本教程操作环境:windows7系统、CSS3& & HTML5版、Dell G3电脑。

今天遇到一个难题,如图:

这样导致效果看起来非常不美观,我们最理想的状态应该是让 div 里面的内容如果超出 div 的宽度,就应该使内容换行显示。

解决办法:

首先我们要先确定 div 是有宽度的,然后在加上 css 样式:代码如下:

word-wrap:break-word;
     word-break:break-all;
     overflow: hidden;
    

结果如下:

这样就达到了我们想要的效果。

推荐教程:《html视频教程》

以上就是html怎么设置文字超出换行的详细内容,更多请关注其它相关文章!

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

自动换行

若转载请注明出处: html怎么设置文字超出换行
本文地址: https://pptw.com/jishu/591577.html
javascript函数怎么写 JavaScript的this指向哪里

游客 回复需填写必要信息