只有部分按钮可点击答案

【问题标题】：Only a part of the button clickable只有部分按钮可点击
【发布时间】：2018-07-06 14:48:48
【问题描述】：

我做了两个按钮，但只有一部分按钮是可点击的，按钮的整个部分应该是可点击的。我使用绝对位置在我的页面中给按钮一个位置。

hml 代码：

<div class="knop">
<a href="https://mylink"><div class="sideLeft"><image 
src="images/knop.png"></div></a>
</div>
<div class="knop">
<a href="https://mylink"><div class="sideRight"><image 
src="images/knop1.png"></div></a>
</div>

有了这个 css：

.sideLeft{
width: 150px;
height: 150px;
position: absolute;
Top: 41%;
display: block;
}
.sideRight{
width: 150px;
height: 150px;
position: absolute;
Top: 41%;
right: 0px; 
display: block
}
.knop img{
width: 150px;
height: 150px;
}

图片： Image

【问题讨论】：

那不是标签而不是吗？
根据您提供的代码，我无法复制您的问题。我怀疑与您未提供的其他 CSS 样式有冲突。也许甚至有一个（不可见的）元素覆盖在按钮上，阻止了鼠标点击事件。

标签： html css image click clickable

【解决方案1】：

要确保您的按钮位于其他元素的顶部，请将其添加到它的类中：

z-index: 999;

z-index 属性指定元素的堆栈顺序。一个具有较大堆栈顺序的元素始终位于具有较大堆栈顺序的元素前面较低的堆栈顺序。

在大多数浏览器中，此(999) 号码可以是从0 到2147483647 的任意位置。

More about z-index

您应该使用<img 而不是<image。

【讨论】：