無法使整個鋰項目可點擊

我看到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 -->

來源

2013-06-22 AppleTattooGuy

這是因爲鏈接僅在文本週圍。如果你想像你一樣對鏈接進行風格化，最好只使用鏈接而不是使用列表。（或者至少我是這麼做的） – jdepypere

你唯一缺少的是a元件上的定位性能。 See fiddle.：

.menu li a { 
    position: relative; 
}

您在az-index: 500沒有被確認，因爲你沒有給任何形式的a元素定位，z-index僅用於定位的元素。

來源

2013-06-22 15:11:49 ScottS

謝謝你清晰，簡單的答案，完美的作品 - 再次感謝:-) – AppleTattooGuy

您既可以放置在li標籤的onclick事件或使用CSS使a標籤填補li。將後一種溶液是通過在a標籤設置display:block;，然後設置高度等適當造型爲li標籤成爲可能。

此外，li標籤是爲了用於列表。儘管在您的完整解決方案中，它們可能會被正確使用，但在您的示例中，只需使用a標籤即可。

來源

2013-06-22 15:09:44 tvkanters

第二種解決方案;爲問題的上下文菜單。真棒。 – redditor

無法使整個鋰項目可點擊

回答

相關問題