Question

我在StackOverflow上看到了一些关于此的主题，并试图在帖子中实现提示但没有运气所以这篇文章不打算复制，我试图让我的整个LI链接可点击，我有在下面设置一个JSFiddle和一些代码。提前感谢您的帮助。

JSFiddle

http://jsfiddle.net/szfdh/

          <div class="menu" id="menubar"> <div class="w_960"><ul>

<li id="menu-item-55" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-53 current_page_item menu-item-55"><a href="#">Home</a></li>
<li id="menu-item-47" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-47"><a href="#">Junior Scheme</a></li>
<li id="menu-item-46" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-46"><a href="#">Teen Scheme</a></li>
<li id="menu-item-45" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-45"><a href="#">About Us</a></li>
<li id="menu-item-44" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-44"><a href="#">Photo Gallery</a></li>
<li id="menu-item-43" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-43"><a href="">Policies</a></li>
<li id="menu-item-48" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-48"><a href="">Contact Us</a></li>
</ul></div><!-- end  menubar w_960 --> </div><!-- end menubar -->

Answer 1

您唯一缺少的是a元素上的定位属性。 See fiddle.：

.menu li a {
   position: relative;
}

z-index: 500上的a未被识别，因为您未提供任何类型的a元素定位，而z-index仅适用于定位元素。< / p>

Answer 2

您可以在onclick代码上放置li个事件，也可以使用CSS将a代码填入li。通过在display:block;标记上设置a，然后为li标记设置适当的高度和其他样式，可以实现后一种解决方案。

此外，li标记用于列表。虽然在您的完整解决方案中它们可能会被正确使用，但在您的示例中，只需a标记即可。

无法使整个LI项目可点击

2 个答案: