导航条是一个网站中必不可少的元素，那么如何用HTML和CSS制作一个导航条呢？下面我给大家分享一下。
工具/材料Sublime Text
首先打开SublimeText软件，新建一个html页面，并且在html页面中准备好html结构，如下图所示
接下来我们在html的body结构里添加导航条的内容，如下图所示
然后就需要在style标签中用CSS对导航条的样式进行定义了，如下图所示，书写样式的时候一定要注意写在style标签里面
最后运行html页面，你就会看到如下图所示的导航条，当鼠标放在某个导航上时，背景色会变成红色
这样的导航一般是切两张图片下来一张是正常状态时候的图片
一张是鼠标移上去时的图片
把切下来的两张图片合在一起，变成一张（这样是为了减少对服务器的请求次数，减小服务器的压力，一般大的网站都是这样做的）
然后设置css，a：hover时，更改背景，注意把背景的位置调整正确
就可以达到效果了
不懂的话百度hi我
给你做类似的例子
