css属性:word-wrap:break-word; 与 word-break:break-all 的用法;
zhangq0123
于 2016-10-19 11:06:12 发布
6475
收藏 9
分类专栏: CSS HTML 文章标签: html css
版权
CSS
同时被 2 个专栏收录
8 篇文章0 订阅
订阅专栏
HTML
4 篇文章0 订阅
订阅专栏
前言:在一个长宽固定的div容器中,多行文字和英文句子都默认自动换行。不过,对于英语单词而言,会有一些微妙的变化!
//没有添加word-wrap:break-word和word-break:break-all时
<div style="width:150px;height:70px;background:red;">
I am a good boy, hahahahhahahahahahaha everyone likes me...
</div>
//添加word-wrap:break-word时(只对那些超出容器宽度的单词进行拆分,而不影响其他正常单词。)
<div style="width:150px;height:70px;background:red;word-wrap:break-word">
I am a good boy, hahahahhahahahahahaha everyone likes me...
</div>
//添加word-break:break-all时(拆分所有单词)
<div style="width:150px;height:70px;background:red;word-break:break-all">
I am a good boy, hahahahhahahahahahaha everyone very likes me...
</div></span>
————————————————
版权声明:本文为CSDN博主「zhangq0123」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/zhangq0123/article/details/52857092
原文地址:https://www.cnblogs.com/webSnow/p/16092594.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。