9

我在 div-box 的底部有一个链接，它有 position:absolute 并且应该覆盖整个 div-box。

像这样：http: //jsfiddle.net/UpwvT/4/

在 FF 和 Webkit 中它工作正常，但在 IE + Opera 中，“一些文本”仍然不是链接，也不能点击。

有人有想法吗？:) 谢谢

4

6 回答 6

7

它看起来像 Opera 和 IE 中的错误。

Opera 和 IE9 有我的 hack。添加这个.link
background-color: rgba(204,204,204,0.01);

这是非常透明的背景。

http://jsfiddle.net/UpwvT/19/

它在 IE8 中不起作用。

于 2011-06-22T10:17:06.677 回答
4

问题解决了 - 只需在 css 中添加链接的透明背景 - 对我来说，透明 gif 文件可以正常工作。

.link_css{
background: url(path_to_your_file/trans.gif);
}
于 2011-12-10T17:08:51.843 回答
3

我使用了 Pavlin 提出的相同解决方案，但使用 1x1px 透明 GIF 数据 URL 编码，这样：

.link_css{
  background: url('data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7');
}

因此，您可以避免向服务器发送额外的 http 请求，而 CSS 样式表中只增加了很少的字节。IE8+ 支持 data-url。
http://caniuse.com/datauri

于 2013-12-05T14:28:46.053 回答
1

仍然不明白这个错误来自哪里......就我个人而言，我只是在那里放了一些完全透明的 bg

background: rgba(0,0,0,0);
于 2012-03-14T19:37:55.713 回答
-1

如何在 div 周围放置链接标签（a），如下所示：

<a class="link" href="http://google.com">
    <div class="box">
        some text
        <div class="linkbox">
            &nbsp;
        </div>

    </div>
</a>

编辑

以下也应该是可能的：

<div class="box">
    <a class="link" href="http://google.com">
        some text
        <div class="linkbox">
            &nbsp;
        </div>
    </a>
</div>

我相信这应该解决它。

于 2011-06-22T10:03:16.723 回答
-1

不需要像这样在框内添加链接框：

<div class="box" onclick="location.href='http://google.com'">
    some text
</div>

并定义这样的样式：

<style>
    .box {
        width:200px;
        height:200px;
        background:#ccc;
        position:relative;
        text-align:center;
        z-index:1;
        cursor: pointer;
        cursor: hand;
    }
</style>

工作演示：http: //jsfiddle.net/rathoreahsan/cLmqe

于 2011-06-22T10:13:55.397 回答