解决Div标签中数字和字母溢出问题

298 阅读1分钟

当我们使用div标签的时候,希望是的当里面内容过长的时候回自动换行,但是事实并不是这样,div标签对连续的数字和字母是不会自动换行的。

例子 image.png 出现的结果

image.png

我们可以通过设置CSS来解决

解决方法

  1. 设置 word-wrap: break-word;

    word-wrap:break-word; 它把连续的字母和数字看成一个整体,如果该行末端宽度不够显示整体,会自动把整体放到下一行,而不会把整体截断。

image.png

  1. 设置 word-break: break-all;

    这就是我们想的那样,内容到了尾部就换行,不管连续不连续

image.png

大功告成