Re: [無名] 請教滑鼠移過圖片更換的語法
推
10/14 02:19, , 1F
10/14 02:19, 1F
→
10/14 02:19, , 2F
10/14 02:19, 2F
→
10/14 02:20, , 3F
10/14 02:20, 3F
要像這個網站一樣的話
作法就比較複雜囉,會用到<li>這個項目符號
首先網誌描述裡的html要拿掉<img>改成這樣:
<ul>
<li id="自設名稱1"><a href="網址">文字</a></li>
<li id="自設名稱2"><a href="網址">文字</a></li>
...
<li id="自設名稱6"><a href="網址">文字</a></li>
</ul>
比方說你的第一個連結是TOP,id裡面就設定成menu_top
第二個是wedding,就設定成menu_wedding
其他四個以此類推
然後再去樣式表設定CSS:
1. .description li{
display:inline;
text-indent: -9999px;}
因為項目符號預設是條列式的,所以要加入display:inline;讓它排成一列
然後在加入text-indent: -9999px;讓超連結中的文字搬到千里遠
2. 接著以TOP為例:
先設定TOP在一般狀態下要用哪張圖
#menu_top a{
background:url("TOP的原始圖網址") no-repeat;
}
在設定滑鼠移到TOP上時是哪張圖
#menu_top a:hover{
background: url("滑鼠移到TOP上時的圖") no-repeat;}
這在pixnet還蠻常見的,大致的作法是這樣
然後因為你有6個連結所以2這個步驟要走六次喔
--
※ 發信站 :批踢踢實業坊(ptt.cc)
◆ From: 114.27.148.159
※ 編輯: b0339576 來自: 114.27.148.159 (10/14 03:06)
推
10/14 04:19, , 4F
10/14 04:19, 4F
推
10/14 13:39, , 5F
10/14 13:39, 5F
推
10/14 20:10, , 6F
10/14 20:10, 6F
討論串 (同標題文章)
本文引述了以下文章的的內容:
完整討論串 (本文為第 4 之 4 篇):
Blog 近期熱門文章
PTT數位生活區 即時熱門文章