链接到完整的 div - html 和 css

【问题标题】：Link into full div - html and css链接到完整的 div - html 和 css
【发布时间】：2020-05-30 23:37:41
【问题描述】：

一些文字

.sliderPart {   
    width: 25%;
    height: 100%;
}

.sliderPart a {
    display:block;
    position:relative;
    text-decoration:none;
    height: 100%;
    font: 1.3em  Arial, Sans-serif;
}

如何使我的链接在所有 div 区域都可点击？

【问题讨论】：

标签： html css

【解决方案1】：

最简单的方法是完全删除 div：

<a href="#computers" class="sliderPart">
   <strong>Some text</strong>
</a>

a.sliderPart {
  ...
}

【讨论】：

【解决方案2】：

试试这个：

$(".trigger").click(function() {
    window.location = $(this).find("a").attr("href");
    return false;
});

..您还需要将cursor: pointer 提供给可点击元素。

【讨论】：

【解决方案3】：

将链接放在 div 之外。您可以使锚标记的行为类似于 div。就像您在发布的 CSS 中所做的那样。

【讨论】：

【解决方案4】：

对于下拉列表，我经常使用下面的方法...

如果您不反对使用脚本，您可以将 div 本身设置为某种代理，这样如果您单击 div 上的任何位置，随后会自动单击该 div 中的第一个链接。

$(".sliderPart").bind("click", function(){
  $("a:first", this).trigger("click");
});

当然，当您将鼠标悬停在 div 上时，您会希望更新您的样式以指示整个内容是可点击的。

【讨论】：