Question

我创建的瓷砖如下：

<div>
  <img src="http://blog.caranddriver.com/wp-content/uploads/2016/01/BMW-i8-Mirrorless-cameras-101-876x535.jpg" width="400" alt="img" />

  <a href="http://www.google.com"></a>
</div>

用css：

div {
  width: 500px;
  border: 1px;
  height: 500px;
  position: relative;
}

img {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: -1;
  margin: auto;
}

a {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  display: block;
  z-index: 2;
  margin: auto;
}

或者jsfiddle：https://jsfiddle.net/fvguL0hn/

您将看到在IE 10中无法点击该图像，但在IE 11中也可以使用其他浏览器。

如果你鼠标移出图像然后你可以点击，但你用光标返回图像，然后指针光标变为正常，你不能点击像锚点被隐藏回图像，即使我改变了z-index 。

这仅在IE 10中发生......

我的错误是什么？我更改了z-index但同样的事情。

Answer 1

为什么不这样做？

<div>
  <a href="http://www.google.com"><img src="http://blog.caranddriver.com/wp-content/uploads/2016/01/BMW-i8-Mirrorless-cameras-101-876x535.jpg" width="400" alt="img" /></a>
</div>

在IE 10中无法点击的图像上的锚点可以在IE 11，Firefox和Chrome中使用

1 个答案: