我的圖片鏈接將無法正常工作

Question

我試圖鏈接的圖像，在HTML中看起來是這樣的：

<a href="#" class="image"><img src="logo.png"></a> 

和CSS我有：

.baraMeniu a.image{ 
    display:block; 
} 

是啊......顯示：塊是一個尷尬的嘗試，使圖像點擊。 我是begginer所以請一步一步來。

編輯：我忘了說我的形象具有以下屬性：

.baraMeniu img{ 
    width:100%; 
    height:40em; 
    position:absolute; 
    z-index:0;/*the image*/ 
} 
.baraMeniu a.image{ 
    /*the clickable image*/ 
} 
.baraMeniu .st{ 
    font-size:2em; 
    padding-top:0.15em; 
    padding-left:0.7em; 
    padding-right:0.5em; 
    color:orange; 
    font-family:'Century Gothic', CenturyGothic, AppleGothic, sans-serif; 
    display:inline; 
    text-decoration:none; 
    float:left; 
} 
.baraMeniu .dr{ 
    font-size:2em; 
    padding-top:0.15em; 
    padding-left:0.7em; 
    padding-right:0.5em; 
    color:orange; 
    font-family:'Century Gothic', CenturyGothic, AppleGothic, sans-serif; 
    display:inline; 
    text-decoration:none; 
    float:right; 
} 

.baraMeniu #ind{ 
    text-indent:20px; 
} 

Answer 1

如果你想環繞你的圖像的<a>標籤，你不需要任何特殊的技巧。

<a href="SomeLink.html"><img src="logo.png"></a> 

這將工作正常。

您可以稍後使用CSS或JS改變其外觀，懸停效果等。

編輯爲清晰。而不是通過頁面上的元素定位圖片，例如a.img.classwhatever{}爲了簡單起見，我會給它一個自己的類，或者把它放在div中。將CSS應用於類或ID。

<div class="ImageLink"> 
<a href="SomeLink.html"><img src="logo.png"></a> 
</div> 

至於Z指數，請注意。消極意味着它背後的一切。