css中怎么添加导航栏

<nav>
    <ul>
        <li><a href="#">首页</a></li>
        <li><a href="#">产品介绍</a></li>
        <li><a href="#">关于我们</a></li>
        <li><a href="#">联系我们</a></li>
    </ul>
</nav> 

nav ul {
    margin: 0;
    padding: 0;
    list-style: none;
    background-color: #333;
}

nav li {
    float: left;
}

nav li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}

nav li a:hover {
    background-color: #4CAF50;
} 

和
• 标签设置了一些基本的样式，包括背景颜色、边距、内边距和浮动方式。对于链接，我们设置了字体颜色、文本对齐方式、内边距和文本装饰等属性。当鼠标停留在链接上时，我们通过设置背景颜色来让用户知道他们正在悬停的链接。
  通过以上的步骤，我们就可以在 CSS 中成功创建一个基本的导航栏。当然，如果你想要进一步美化导航栏，还可以通过添加背景图像、设置渐变颜色和添加动画效果等方式来实现。