为了账号安全,请及时绑定邮箱和手机立即绑定

盒子模型内容是数字怎么没跟着文字一样换行

https://img1.sycdn.imooc.com//5b4221d30001051411210560.jpg

如图,像这样

正在回答

2 回答

原因:浏览器在解析页面的时候,把这一串数字当成一个单词了,这样就不会自动切断字符串而进行换行。

方法:用word-wrap:break-word

和word-break:break-all 如

div{
    background-color: #c8ff7e;
    width: 100px;
    height: 100px;
    word-break:break-all
}

word-wrap:break-word; 和 word-break:break-all 的区别
1,word-break:break-all 例如div宽100px,它的内容就会到100px自动换行,如果该行末端有个英文单词很长,它会把单词截断。
2,word-wrap:break-word 例子与上面一样,但区别就是它会把单词看成一个整体,如果该行末端宽度不够显示整个单词,它会自动把整个单词放到下一行,而不会把单词截断掉的。


8 回复 有任何疑惑可以回复我~
#1

iaaiNG 提问者

非常感谢!
2018-07-09 回复 有任何疑惑可以回复我~

同问,我刚才也遇到这个问题,我自己手工加了个"<br>"来换行了。哈哈

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
初识HTML(5)+CSS(3)-升级版
  • 参与学习       1225293    人
  • 解答问题       18230    个

HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义

进入课程

盒子模型内容是数字怎么没跟着文字一样换行

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信