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

这是因为您的按钮是块级元素，您需要将其设置为内联块

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>

仅在按钮中将链接按钮与HREF对中

4 个答案: