<span>當背景顏色在內部文字懸停

-1

我創建了一些圖像，當你把它們放在上面時，它們顯示一些文字在上面，到目前爲止它都工作得很好，但現在我遇到的問題是如何保持背景黑色徘徊在H2 ..任何幫助感激<span>當背景顏色在內部文字懸停

這是我

<a href="#"> 
    <h2>Some Text</h2> 
    <span> 
    <img src="http://www.sheridanrogers.com.au/wp-content/uploads/2011/03/American-pancakes.jpg"/> 
    </span> 
</a>

和CSS

img {width:250px;} 

a:hover h2 {display: block!important;} 

a h2 { position: absolute; top:0 ; display: none; color: #fff;} 

a span {display: inline-block;} 

a:hover span {background: #000} 

a span img:hover, a span:hover img {visibility: hidden;}

來源

2013-10-20 Superfast Goose

像這樣的事情？ http://jsfiddle.net/buNBm/3/ –

你可以簡單地把它，只用H2標籤：

<a href="#"> 
    <h2>Some Text</h2> 
    <img src="http://www.sheridanrogers.com.au/wp-content/uploads/2011/03/American-pancakes.jpg"/> 
</a>

而對於CSS

a { position: relative; display: inline-block } 

a img { 
    width:250px; 
} 

a h2 { 
    display: none; 
    position: absolute; 
    top: 0; 
    left: 0; 
    right: 0; 
    bottom: 0; 
    margin: 0; 
    background: black; 
    color: #fff; 
} 

a:hover h2 { 
    display: block; 
}

在這裏看到的演示：http://jsfiddle.net/jiceb/xsFmA/

來源

2013-10-20 13:28:45 jiceb

你只需要添加一個規則樣式的span上h2:hover：

h2:hover + span img, 
a span img:hover, 
a span:hover img { 
    visibility: hidden; 
}

JS Fiddle demo。

但是你可以，很容易，用替換所有這些選擇：

a:hover span img { 
    visibility: hidden; 
}

JS Fiddle demo。

來源

2013-10-20 13:16:39

剛上img添加visibility: hidden;而徘徊在a

SEE THE DEMO HERE

a:hover span img 

{ 
    visibility: hidden; 
}

來源

2013-10-20 13:18:06

試試這個：

<a href="#"> 
    <h2 onmouseout="document.getElementById('123').style.backgroundColor='white';document.getElementById('456').style.visibility='visible';" onmouseover="document.getElementById('123').style.backgroundColor='#000';document.getElementById('456').style.visibility='hidden';">Some Text</h2> 
    <span id='123'> 
    <img id='456' src="http://www.sheridanrogers.com.au/wp-content/uploads/2011/03/American-pancakes.jpg"/> 
    </span> 
</a>

來源

2013-10-20 13:39:12

<span>當背景顏色在內部文字懸停

回答

相關問題