使用HTML和CSS的鼠標懸停導航下拉菜單

Question

我想問一下，是否有使用CSS和HTML開發鼠標懸停下拉菜單的方法，因為我之前曾見過像google這樣的某些網站開發過這樣的菜單，並且似乎一旦您通過它，便會隱藏標簽將對您可見。

如果有任何想法，請提供該想法的源代碼

謝謝並恭祝安康

Answer 1

這稱為CSS懸停菜單。 它們是使用JavaScript的絕佳選擇。

實施示例：

.trigger ul.menu
{
    display: none;
}
.trigger:hover ul.menu
{
    display: block;
}

示例教程： http : //www.shingokko.com/blog-entry/pure-css-hover-menu.html

與其他答案相反，此方法與跨瀏覽器兼容。 如果實施正確，它將在IE6 + （源）中正常工作。

Answer 2

我認為我無法對此做出更好的解釋： http : //www.htmldog.com/articles/suckerfish/dropdowns/

那就是所謂的“ Suckerfish Dropdowns之子”。 它應該使您朝正確的方向前進。 請注意，僅CSS下拉菜單在IE 6及更低版本中不起作用。