html – 使整个可点击元素里面没有javascript

参见英文答案 > How do I make the whole area of a list item in my navigation bar,clickable as a link?8个
有什么办法吗

我有一个< ul>一些< 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>标签,那么您可以设置宽度和高度或填充,如果要使可点击区域更大.