昨天用傲游瀏覽器測試了一下前幾天做的頁面,突然發現一個問題:在極速模式下,鼠標經過a標簽時不能正常顯示下劃線。一開始以為是自己代碼的問題,但是怎么調試都沒有發現問題,而且在其他主流瀏覽器上測試沒有任何問題,這難道是瀏覽器的BUG?于是去傲游的論壇發個帖子,想得到官方的幫助,意外的是我的這帖子還被那個版主鄙視了,心里很不爽,于是決定自己非得找到原因不可(還有一個原因就是老板正好用傲游還要過他這關啊)。
一開始我將CSS文件的前幾行樣式給刪了,如下:
body{margin:0;padding:0;font:12px/1.8 “宋體”;position:relative;}
h1,h2,h3,h4,h5,h6,form,input,textarea,ul,li,dt,dl,dd{margin:0;padding:0;}
ul{list-style:none;}
發現刪掉之后就有下劃線了,心里有一絲的興奮,至少我找到問題的大致地方了。經過排除,最后鎖定到了body里面的font屬性,一開始以為是line-height問題,但怎么設置還是不行,于是想到去騰訊網看看,可以意外的發現騰訊網的a標簽也沒有下劃線,再看了一下它的樣式,發現騰訊網使用的默認字體是“宋體”,而我的也是,難道是字體的問題?于是我將宋體換成了verdana試了一下,果然有下劃線了。
為了確認是字體的原因,于是自己就單獨去除了a標簽,代碼如下:
<html>
<head>
<title>
</title>
<style>
body{font:12px/1 “宋體”;}
a{color:#333;text-decoration:none;}
a:hover{color:#f00;text-decoration:underline;}
</style>
</head>
<body>
<a href=”#”>test</a>
</body>
</html>
經過測試確實是字體的原因,然后又將字體換成微軟雅黑也能正常顯示,唯獨使用宋體的時候沒有下劃線。測試期間無意間發現搜狗瀏覽器(version 4.0)也有這樣的問題。
最后的結論:在傲游瀏覽器極速模式下,如果a標簽使用了宋體,那么鼠標經過時不能正常顯示下劃線(當然肯定要定義a:hover{text-decoration:underline;})。
新聞熱點
疑難解答