<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>$美少女战士$</title>
<style>
div {
width: 650px;
height: 80px;
background-color: #000
}
span {
width: 120px;
height: 80px;
/*转换为行内块*/
display: inline-block;
text-align: center;
/*行高 line-height: 文字垂直居中：文字的行高 == 盒子高度*/
line-height: 80px;
}
span:hover {
background-color: gold;
}
a {
/*清除下划线*/
text-decoration: none;
color: #fff;
}
/*伪类选择器 :target :hover 鼠标移入怎么样*/
</style>
</head>
<body>
<div>
<span><a href="#">发现音乐</a></span>
<span><a href="#">我的音乐</a></span>
<span><a href="#">朋友</a></span>
<span><a href="#">商城</a></span>
<span><a href="#">下载客户端</a></span>
</div>
</body>
</html>
html5基础知识点表单
猜你喜欢
转载自blog.csdn.net/weixin_42218868/article/details/88670113
今日推荐
周排行