作者vgb (前三就好!)
看板Web_Design
標題[問題] ul li圖示按鈕點選時遇到的問題...
時間Tue Dec 16 18:48:58 2014
摸索了兩天還是整理不出頭緒 只好求助各位高手大大...
我的圖片在上方,每張不同的圖片下方會有Home Logout About字樣...
但是做完之後發現,滑鼠移過去, 字跟圖是分別滑鼠顯示hover的狀態....
而不是一起變色,改很久還是沒辦法一起做hover,想請教我需要改什麼呢?
我的網頁架構如下
<div class="top">
<ul class="top_link">
<li><a href="#"><span class="home_n sprite"></span><em>Home</em></a></li>
<li><a href="#"><span class="Logout_n sprite"></span><em>Logout<em></a></li>
</ul>
</div>
圖示是用在<span>裡面,採用CSS Sprite去做
CSS是:
.home_n{
(顯示一般狀態的圖的坐標)
}
.sprite{
是放所有Home Logout About的一整張png圖檔(有一般狀態跟滑鼠移過去的圖示)
}
目前字變色我是強制用
li a:hover{
color:#0000ff;
}
圖片是
.home_n:hover{
(顯示滑鼠移過去的圖的坐標)
}
請問有沒有更好的架構或是方法??? 感謝....>"<
--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 59.120.184.171
※ 文章網址: http://www.ptt.cc/bbs/Web_Design/M.1418726940.A.B15.html
※ 編輯: vgb (59.120.184.171), 12/16/2014 18:49:35
※ 編輯: vgb (59.120.184.171), 12/16/2014 18:51:25
→ crossdunk: 圖片變色是什麼意思 12/16 18:52
→ vgb: 比如home是藍色小房子的圖 滑過去變成白色小房子的圖 12/16 19:20
→ miau: selector錯了,要用 a:hover .home_n {} 才對,:hover加在a 12/16 19:53
→ vgb: 哦哦可以了~感謝miau大大~字跟圖可一起變色了!!ya!((灑花)))) 12/17 10:47
→ vgb: 大感謝~~~~>//////< 12/17 10:47