CSS导航栏是Web开发中常用的一种元素，它能够帮助用户快速找到自己需要的信息。下面是一个简单的CSS导航栏案例。

<ul id="nav">
<li><a href="#">首页</a></li>
<li><a href="#">新闻</a></li>
<li><a href="#">产品</a></li>
<li><a href="#">联系我们</a></li>
</ul>

上述代码中，我们使用<ul>标签来创建导航栏，每个导航项使用<li>标签包裹，通过给<a>标签添加href属性来指定导航项的链接地址。

#nav {
list-style: none;
background-color: #333;
overflow: hidden;
}
#nav li {
float: left;
}
#nav li a {
display: block;
color: #fff;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}

在CSS中，我们使用id选择器来选中导航栏，分别给导航栏和导航项设置样式。使用float属性让导航项横向排列，给导航项的<a>标签设置样式让导航项看起来更加美观。

通过以上代码，我们成功地创建了一个简单的CSS导航栏。