将Hyperlink应用于CSS Created DIV

Question

我需要想办法让黄盒子<div id="bottom">和文字<div id="basket">SHOP NOW</div>链接到google.com。

我尝试添加<div id="bottom"><a href="www.google.com" class="fill-div"></a> </div>，但没有任何效果。当我添加这种语法时，它似乎会扭曲整个部分。

我已经搜遍了所有寻找答案的地方，我已经阅读了几乎所有相关的StackOverflow文章，但仍然无法找到正确的方法来做到这一点。

以下是我的代码的https://jsfiddle.net/sixpac/8p4m7oc2/8/链接。

有人能指出我正确的方向吗？这可以在没有JavaScript的情况下完成吗？谢谢！

Answer 1

您正在寻找类似https://jsfiddle.net/8p4m7oc2/13/

的内容

<div id="bottom">
    <a href="google.com" id="basket">SHOP NOW</a>
    <div id="price"><a href="google.com">$70.00</a></div>
</div> 

Answer 2

您可以将div元素包装在一个锚元素中，以使其链接到您选择的网址/文件。

即

<a href="www.google.com" class="fill-div">
<div id="bottom">
</div>
</a>

这应该是代码：

https://jsfiddle.net/RreTH/

编辑：

这会使整个div元素链接到谷歌，只链接<a href="example"></a>应足以链接文本的文本。

Answer 3

只需将basket div更改为<a>：

<a id="basket" href="http://www.google.com">SHOP NOW</a>