如何使导航栏中列表项的整个区域可作为链接单击?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (1)
  • 关注 (0)
  • 查看 (52)

有没有办法?

我有一个<ul>和一些<li>里面的元素。这是下拉菜单的一部分。各<li>变成一个最大的<li>元素

问题是我希望人们能够在每个人的任何地方点击<li>框有链接,而不是只是在文本。如果可能的话,我想要一个非javascript的解决方案。

这里有一些HTML示例。内在<li>元素是有链接的元素。

<li class="parent Glass" style=" float: left;">

Glass
    <ul class="child" style="float: left; position: absolute; z-index: 999; display: none;">
    <li style=" float: left;">
                <a href="http://example.com/path/to/somehwere.html?glass=25">Brown       (13)</a>

    </li>
    <li style=" float: left;">
                <a href="http://example.com/path/to/somehwere.html?glass=112">Crystal       (93)</a>

    </li>
    <li style=" float: left;">
                <a href="http://example.com/path/to/somehwere.html?glass=99">Gray       (1)</a>

    </li>
    <li style=" float: left;">
                <a href="http://example.com/path/to/somehwere.html?glass=42">Latte       (12)</a>

    </li>
    <li style=" float: left;">
                <a href="http://example.com/path/to/somehwere.html?glass=72">White       (15)</a>

    </li>
    </ul>

</li>
提问于
用户回答回答于

你需要添加display:block到你的<a>标签,然后你可以设置一个宽度和高度或填充,如果你想使可点击区域更大。

扫码关注云+社区

领取腾讯云代金券