如何使可點擊的div內具有鼠標懸停圖像鏈接？

Question

我正在嘗試使一個可點擊的div將鼠標懸停圖像鏈接保存在其中。 我已經在其中有了過渡圖像，但是整個div都沒有變成可點擊的鏈接。

html看起來像這樣：

 <div class="left1" id="range-logo">
 <div class="left1button"> <a href="#"></a> </div>               
 </div>

我的過渡圖像鏈接正在運行，但是保存該過渡圖像鏈接的div並未變成鏈接。 我希望整個事情是一個鏈接/可點擊的。

我要通過這樣做來實現的目的是要使一個具有背景圖片的可點擊div（＃range-logo為其賦予背景）。 我希望將鼠標懸停在該背景圖像上進行更改。 而且，在該div內部，我想要一個圖像翻轉鏈接。

我正在處理的網站可以在以下位置找到：

http://shopmoonfall.bigcartel.com/

我正在大滑塊下面的第一個div（第一個戴墨鏡的女孩）工作。

Answer 1

好的，我認為我不太了解，很難在沒有使用任何已發布內容的情況下為您提供准確的代碼

#range-logo:hover a{
    background-color: #FFF
    //add whatever styles you want on that tag
}

編輯只需使用a標簽，然后向其添加id="range-logo" 。 a本質上是inline-block ，因此如果您希望它的行為類似於div，請使用display: block; 。 現在您不需要里面a標簽，使用div並向其中添加一個類

<a class="left1" id="range-logo" href="/products">
    <div class="left1button"> <div class="someName"></div></div>             
</a>

編輯2

你有這樣的腳本的定位的a內部.left1button

.left1button a {
   display: block;
   width: 158px;
   height: 37px;
   top: 175px;   
   left: 75px;
   background-image: url(http://oi40.tinypic.com/2zfr7h4.jpg);
}

因此，您可以執行2件事中的1件事，可以使用<div></div>代替<a href="#"></a>並將上述目標更改為.left1button div ，也可以刪除整個內容並使用類似

.someName { //Call this whatever you want
   display: block;
   width: 158px;
   height: 37px;
   top: 175px;   
   left: 75px;
   background-image: url(http://oi40.tinypic.com/2zfr7h4.jpg);
}

然后您可以使用上面的示例。 無論你想要什么