Question

有什么办法吗？

我有<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>

Answer 1

您需要将display:block添加到<a>代码中，然后您可以设置宽度和高度或填充[{1}}]，如果您想让可点击区域更大

使用<a> element inside without javascript</a> </li>制作整个<li>可点击的内容

1 个答案: