[問題] 改變超連結 href 底線顏色?
請問要如何作出不同於文字顏色的底線?
這裡有個很簡單的範例:
http://www.google.com.tw/
就是上面這個,有用 PCMan / KKMan 等等的程式瀏覽 ptt 時應該就會看到了
我查過文件,上頭寫道:
超連結的底線顏色 text-decoration 屬性沿自 color (昏倒...)
也就是說,假若 color:red
那麼 text-decoration:underline 的顏色也是 red
那有沒有什麼替代方案,可以作出上面的那種效果呢?
我有試過用框線去模擬
可是發生一些問題...望請指教
=============================================================================
<style>
.pseudoline {
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: #ff8000}
A:link,A:visited,A:hover,A:active {text-decoration: none}
.hahapoint {text-decoration: underline}
</style>
<h1><a href=# class=pseudoline>測試</a><span class=hahapoint>文字</span></h1>
=============================================================================
以上直接複製即可進行測試,然後這樣做出來的效果就很像了
但很不幸地,發生 IE 與 Firefox 的「互不相容性」問題
用 IE 開啟網頁,會出現「虛擬底線」比較低的狀況
而 Firefox 則是與 underline 相近位置
請比較一下:
IE 之中,「測試」的底線會比「文字」的底線要低一點
Firefox 會差不多高
倘若框線是唯一的替代方案,有沒有辦法讓 IE 的框線位置再高一點?
PS: 因為這在使用 line-height:100% 的時候會發生與下面一行字重疊的現象
只有 IE 會這樣,Firefox 不會
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 220.133.248.14
推
06/14 03:55, , 1F
06/14 03:55, 1F
推
06/14 06:00, , 2F
06/14 06:00, 2F
→
06/14 06:08, , 3F
06/14 06:08, 3F
推
06/14 11:20, , 4F
06/14 11:20, 4F
討論串 (同標題文章)
以下文章回應了本文:
完整討論串 (本文為第 1 之 2 篇):
Web_Design 近期熱門文章
PTT數位生活區 即時熱門文章