element-UI的导航栏只适用于电脑端,无法适配手机;
bootstrap导航栏不仅可以适配电脑端,还可以在手机屏幕上折叠,兼容性可以,样式可以通过修改自定义样式来改变,但是改变的程度不大,如果要做出丰富的自定义导航栏,还是应该使用原生的html和css来做。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>导航栏</title>
<style>
ul{
list-style:none;
padding:0px;
margin:0px;
background-color:green;
}
li{
display:inline-block;
background-color:white;
color:black;
padding:0px;
margin:0px;
width:20%;
text-align:center
}
a{
width:100%;
background-color:gray
display:inline-block
}
li>a:hover{
background-color:yellowgreen;
}
li>a:active{
background-color:red;
}
li>a:visited{
background-color:red
}
</style>
</head>
<body>
<ul>
<li><a>菜单1</a></li>
<li><a>菜单2</a></li>
</ul>
</body>
</html>