依照图片来看,我想楼主使用的是Chrome浏览器吧
主要是因为Chrome浏览器有个很机车的设定,也就是字级小于最小字级的设定是不理会的
(Chrome默认是12px,可以在设定>自订字型>最小字体找到)
而那块验证码正是使用文字来拼成数字的
怎么说呢,请看下图
https://i.imgur.com/7oBo1fK.png
这个是使用开发人员工具去找到的那块在html的原始码
(有兴趣的人可以在chrome按F12去玩玩)
可以看到它是一串*和空白去组成的( 在html里会解析成空白格)
然后再找一下它的CSS设定
https://i.imgur.com/nbqZ9CC.png
第一个是字型的设定,第二个就是字号的设定
我们这边看到它设定成5px
这就是问题所在拉,因为Chrome机车的设定
所以你看到的文字是12px大小去组成的验证码
也是为什么你的数字看起来比较扁平的缘故!!!
我们看看firefox
https://i.imgur.com/6FpLph3.png
再看看前端极端厌恶的万恶的IE
https://i.imgur.com/zTnanO7.png
都是正常的呢
我想这跟当初设计这块的人忘记了Chrome有这样的字号限制
顺道一提,开发者工具里面的数值可以去修改玩玩看,如果要让它看起来正常
我们可以修改刚刚看到的line-height那边的数值
这是指文字的行间距
https://i.imgur.com/afDXLs7.png
把它改成6px看起来就正常多了呢
整体看起来也比较大就是了
或是去上面提到的设定里面,把字号限制调至5px以下
https://i.imgur.com/0iXS9K5.png
回来看就是正常的囉
不得不说想到用文字来拼成验证码这个想法挺有趣的
不过可能没有在Chrome被发现这个问题
(其实也不算问题,是Chrome的好意,小于12px的字在网页上看起来有点吃力)
我相信这篇如果被他们发现应该会去叫当初作网页的人修正的吧
毕竟Chrome还是比较多人用的 哈哈哈
笨点的话,我想就是为了回这个文职业病发作和认真去帮忙别人找Bug解法吧,哈哈哈哈