依照圖片來看,我想樓主使用的是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解法吧,哈哈哈哈