(⼗三)使⽤⽆序列表制作导航栏效果:
代码:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<style type="text/css">
ul{
list-style: none;    //隐藏⾃带的属性(去除圆圈)
}
li{
ps:此处得注意先后顺序。⽐如背景颜⾊在最前⾯,⽂字居中在左浮动和⾼宽得后⾯
background-color: red;    //背景颜⾊
float: left;    //左浮动(竖排的⽆序列表会变成横排)
height: 30px;
width: 100px;
text-align: center;    //⽂字居中
color: #000f;
border-radius: 15px 15px 0 0 ;    //每个li元素的圆⾓
}
li a{
text-decoration: none;    //a标签的下划线
}
li a:hover{
background-color: green;    //hover效果html怎么做下拉式多级导航栏
color: yellow;
}
</style>
</head>
<body>
<ul>
<li><a href="#">⾸页</a></li>
<li><a href="#">今⽇活动</a></li>
<li><a href="#">产品展⽰</a></li>
<li><a href="#">售后服务</a></li>
<li><a href="#"></a></li>
</ul>
</body>
</html>