0
需要一點點的幫助,我已經敲了一個快速小提琴。css懸停問題
鏈接在這裏:http://jsfiddle.net/ozzy/qaN84/
CSS:
.outer {
width:210px;
height:180px;
padding:10px;
border:1px solid #aaaaaa;
border-radius:3px;
}
.month {
width:40px;
height:40px;
float:left;
margin:5px 5px;
border:1px solid #aaaaaa;
display:inline;
background-color:#efefef;
}
.month h3 {
font-size:16px;
font-weight:bold;
color:#444444;
text-align:center;
vertical-align:middle;
line-height:18px;
margin-top:10px;
text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.5);
font-family: "proxima-nova-1","proxima-nova-2",Helvetica,Arial,sans-serif;
text-transform:uppercase;
}
#current {
background-color:#dedede;
border:1px solid #ec008c;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 2px rgba(255, 255, 255, 0.5) inset;
}
.month h3:hover {
color:#ec008c;
cursor:pointer;
}
.gallLink {
float:right;
margin-right:10px;
}
.gallLink a{
font-family: "proxima-nova-1","proxima-nova-2",Helvetica,Arial,sans-serif;
font-weight:normal;
text-decoration:none;
text-transform:uppercase;
font-size:12px;
color:#3399ff;
}
.gallLink a:hover{
color:#ec008c;
border-bottom:1px dotted #ec008c;
}
HTML:
<div class="outer">
<div class="month"><h3>jan</h3></div>
<div class="month"><h3>feb</h3></div>
<div class="month"><h3>mar</h3></div>
<div class="month"><h3>apr</h3></div>
<div class="month"><h3>may</h3></div>
<div class="month"><h3>jun</h3></div>
<div class="month" id="current"><h3>jul</h3></div>
<div class="month"><h3>aug</h3></div>
<div class="month"><h3>sep</h3></div>
<div class="month"><h3>oct</h3></div>
<div class="month"><h3>nov</h3></div>
<div class="month"><h3>dec</h3></div>
<div class="gallLink"><a href="/rogues-gallery/">View Gallery</a></div>
我要的是煥用戶將鼠標懸停在該月的廣場之一,懸停效果踢進來。目前只有當我將鼠標懸停在文字上時才起作用。
我也編碼這是最有效的方式嗎?關於突出當前月份?
或者還有更好的方法。
任何幫助表示讚賞
謝謝...我要瘋了這裏,我只是不能得到該代碼在我的本地機器argghhh工作。 – 422
確保您硬刷新並清除緩存。 :) – ysrb
哈哈,那是MAD!是的清理緩存和它的工作歡呼夥計。我無法相信我把我的徘徊在糊塗:)謝謝。投票 – 422