<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
ul{
list-style-type: none;
}
.nav{
height: 40px;
background-color: pink;
}
.nav li{
float: left;
line-height: 40px;/*行高 文字上下居中*/
width: 100px;
height: 100%;
background-color: red;
text-align: center;/*文字左右居中*/
color: white;
}
.nav li:hover{
color:blue;
cursor: pointer;
}
*{
margin:0;
padding: 0;
}
</style>
</head>
<body style="background-image: url('1.jpg');background-repeat: no-repeat;">
<ul class="nav">
<li>发现音乐</li>
<li>我的音乐</li>
<li>朋友</li>
<li>商城</li>
<li>音乐人</li>
<li>下载客户端</li>
</ul>
<link rel="icon" type="image/x-icon" href="favicon.ico">
</body>
</html>
浏览器: