HTML和css怎样制作横排导航条，菜单
编辑：Simone
2025-01-10 21:14:00
558 阅读
很多小伙伴学习了一段时间的HTML和css，就想自己动手试试制作导航条菜单，不过却没有思路，今天小编我就来分享一下HTML和css制作导航条的实例，大家可以参考参考。
如图，制作导航条菜单一般是用一个div嵌套ul和li标签，然后li里面有a标签。
布局做好之后，开始写导航条的样式，如图，先清除导航条的margin和padding。
然后定位导航条的div，这里我就用绝对定位来居中，如果你有其他导航条居中方法可以忽略这一条。
然后设置导航条的li左浮动，并且去掉li前面的圆点，让导航条更好看。
然后设置导航条的a标签转块级，以及导航条菜单的宽高，文字颜色，水平垂直居中和背景色以及去掉a标签的下划线。
接着设置鼠标经过导航条菜单变色即可。
最后，一个完美的导航条菜单就完成了，简直是太简单了。
版权声明：本站【趣百科】文章素材来源于网络或者用户投稿，未经许可不得用于商用，如转载保留本文链接：https://www.qubaik.com/life/116931.html
