使用HREF只在按鈕中對齊鏈接的按鈕

Question

我在中心按鈕中有一個鏈接，但問題是鏈接在按鈕的所有x軸中都是可單擊的。我只想將鏈接放在按鈕圖片中。 更簡單的解釋方法是，如果指針光標位於按鈕旁邊，則該指針將變爲手形光標。如果它在按鈕上，我只想讓它變成手形光標。這是我的代碼。

img.center2 { 
 
    display: block; 
 
    margin-top: 28px; 
 
    margin-left: auto; 
 
    margin-right: auto; 
 
}

<a href="SignUp.html"><img src="Button1.png" class="center2"></a>

Answer 1

這是因爲你的按鈕是一個塊級元素，你需要使它inline-block的

img.center2 { 
 
    display: inline-block; 
 
    margin-top: 28px; 
 
    margin-left: auto; 
 
    margin-right: auto; 
 
} 
 

 
div.container { 
 
    text-align: center 
 
}

<div class="container"> 
 
    <a href="SignUp.html"><img src="Button1.png" class="center2"></a> 
 
</div>

Answer 2

添加

Curosor: hand; 

這應該使光標變爲圖像時的一隻手。

Answer 3

這裏是一種方法，你可以把圖像放在一個用div元素製作的「按鈕」中。

我畫背景紅色是顯而易見的。您可以按需要自定義它。

.btnContainer{ 
 
    width:50px; 
 
    height: 30px; 
 
    padding: 15px 20px; 
 
    background: red; 
 
    text-align:center; 
 
} 
 
.btnContainer a{ 
 
    display:inline-block; 
 
    margin:0 auto;  
 
}

<div class="btnContainer"> 
 
<a href="SignUp.html"><img src="Button1.png" class="center2"></a> 
 
</div>

Answer 4

.center img { 
 
    display: inline-block; 
 
    margin-top: 28px; 
 
    margin-left: auto; 
 
    margin-right: auto; 
 
} 
 

 
.center { 
 
    text-align: center 
 
}

<div class="center"> 
 
    <a href="SignUp.html"><img src="Button1.png"></a> 
 
</div>