博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
解决浏览器显示长数字不能自动换行或长字母不能换行的问题
阅读量:6656 次
发布时间:2019-06-25

本文共 944 字,大约阅读时间需要 3 分钟。

在网页中,如果出现长数字或长的字母组合时,如果不加以控制,它就会破坏网页的布局,控制不好可能就会显示不全,照成显示的数据丢失。虽然这种字符串一般不会出现,但是不加以控制,被某些有心的人钻了空子,就可能破坏整个网页的布局,得不偿失,今天我就来解决下这个问题。

首先看一下是什么问题:

例如:

11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111

abcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcdabcd

是不是把博客园的布局都给毁了??

 

然后分析一下这个问题的原因:

个人认为长数字和长字母被认为是一个单词,安道理,一个单词是不应该被分割的,要一直显示下去,被分割后就没人认识了,所以浏览器就不给你换行,照成布局被毁坏!

 然后我就在博客园的闪存那里试了下会不会出现这个问题,发现谷歌浏览器正常

看了下代码,是 word-wrap: break-word; 这句话起的作用,这句话的意思就是 内容将在边界内换行

去掉后就会变成这样

看来我们的问题已经解决了,但是ie浏览器就没有这么好了,请看下图:

没有变化,只是一大长条的数字,没有换行!

解决的方法是:在那一条长数字的外面加一个<p>标签就好了

请看解决后的ie的样子:

谷歌浏览器的样子:

完美解决!

转载于:https://www.cnblogs.com/liuhongxi/p/4002136.html

你可能感兴趣的文章
【LeetCode每天一题】Jump Game II(跳跃游戏II)
查看>>
java -cp 用法介绍
查看>>
mycat(4)
查看>>
winform窗体间传值
查看>>
[资料收集]Java-Java文件操作大全
查看>>
ORACLE - 管理控制文件
查看>>
metro 下载xml文件
查看>>
Spring REST实践之客户端和测试
查看>>
java注解(转)
查看>>
使用activeMQ实现jms
查看>>
linuxC动态内存泄漏追踪方法
查看>>
[转]PHP Session原理分析及使用
查看>>
(二)selenium元素定位
查看>>
数据库部分
查看>>
python字典的定义和操作
查看>>
excel批量加前后缀
查看>>
2D空间中求线段与圆的交点
查看>>
常见标签的默认属性值及相互作用——关于CSS reset的思考
查看>>
jQuety遍历数组
查看>>
jvm的内存模型
查看>>