css - 无法制作 Css 菜单

Question

如何在 CSS 中制作导航菜单？我想要一个带有 4 个菜单按钮的菜单！一直在搜索谷歌并询问朋友，但一直无法弄清楚！

提前致谢！

Answer 1

首先，请在再次发布之前阅读有关此问题的第一个答案。它将帮助您了解 SO 的用途： https ://meta.stackexchange.com/questions/125997/something-on-my-web-site-doesnt-work-can-i-just-paste-a-link对它

工作示例：http: //jsfiddle.net/k3AbH/1/

HTML：

<ul>
    <li><a href="http://www.google.com">Item 1</a></li>
    <li><a href="http://www.google.com">Item 2</a></li>
    <li><a href="http://www.google.com">Item 3</a></li>
    <li><a href="http://www.google.com">Item 4</a></li>
</ul>

CSS：

ul li {
    float:left;
    list-style:none;
}

ul li a {
    padding:6px 10px;
    border-right:1px solic #C0C0C0;
    font-size:13px;
    color:#FFF;
    background-color:#A1A1A1;
    display:block;
}

ul li a:hover {
    background-color:#C0C0C0;
}

Answer 2

<ul>
    <li></li>
    <li>
        <ul>
            <li></li>
            <li></li>
        </ul>
    </li>
</ul>

ul li > ul { display: none; }
ul li:hover > ul { display: block; }