沒有js，php或目標的下拉onclick

Question

我想在沒有JavaScript的情況下創建onclick下拉菜單，也不能使用PHP。我使用的是目標，但每次點擊時都會跳轉頁面，因爲它不在頁面頂部。 是否有可能使下拉菜單沒有JS和PHP，但onclick？

Answer 1

你所追求的是實際上可能的，雖然我不會建議你實際使用這種技術。這不過是一種黑客攻擊，在語義上非常不正確，可能是SEO的噩夢。

這種考慮，我將解釋該技術作爲一個概念證明：

首先確保你組織你的HTML這樣的：

<nav> 
    <ul> 
     <li> 
      <label for='item-1'>main item 1</label> 
      <input type="checkbox" id="item-1"/> 
      <ul> 
       <li><a href="#">sub 1</a></li> 
       ... 
      </ul> 
     </li> 
     ... 
    </ul> 
</nav> 

一些聰明的使用:checked選擇的和兄弟+選擇器現在允許您模擬點擊下拉菜單。相關CSS應該是這樣的：

/* we hide the checkboxes, they are just there to store the 'state' in the background */ 
/* their state will be triggered by clicking the corresponding label */ 
nav input[type="checkbox"] { 
    display: none; 
} 
/* we hide the sub menu's by default */ 
nav > ul > li > ul { 
    display: none; 
} 
/* we show the sub menu, if it follows a checked checkbox */ 
nav input[type="checkbox"]:checked + ul { 
    display: block; 
} 

有關工作例如，檢查我成立了小提琴：http://jsfiddle.net/Xj8Ce/

Answer 2

如果你想要「onclick」事件，你需要JavaScript。 隨着懸停你可以試試這個：http://line25.com/tutorials/how-to-create-a-pure-css-dropdown-menu

希望它有幫助！