作为一个穷人，唯一一次逛这么久的会员首页还是因为要写最头大的web~苦涩
效果图
源码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<link rel="icon" href="qqIcon.jfif" type="image/x-icon"/>
<title>QQ会员</title>
<link rel="stylesheet" href="qqmember.css" type="text/css"/>
</head>
<body>
<div id="all">
<nav>
<ul>
<li>
<image src="logo.png" height="100px width="100px"/>
</li>
<li class="words">
<a href="#">功能特权</a>
</li>
<li class="words">
<a href="#">游戏特权</a>
</li>
<li class="words">
<a href="#">生活特权</a>
</li>
<li class="words">
<a href="#">会员活动</a>
</li>
<li class="words">
<a href="#">成长体系</a>
</li>
<li class="words">
<a href="#">年费专区</a>
</li>
<li class="words">
<a href="#">超级会员</a>
</li>
</ul>
</nav>
<div>
<div>
<a href="#" class="button" id="open">开通超级会员</a>
</div>
<div id="open">
<a href="#" class="button" id="land">登录</a>
</div>
</div>
</div>
</body>
</html>
body{
margin:0;
padding:0;
}
#all{
width:100%;
height:100px;
background-color:rgba(0,0,0,0.15)
}
ul{
list-style-type:none;
margin:0;
padding:0;
}
li{
display:inline-block;
float:left;
}
.words{
margin-top:45px;
margin-left:45px;
width:100px;
}
.button{
border:1px solid #000080;
border-radius:15px;
background-color:#BC8F8F;
padding:10px;
margin-top:30px;
float:right;
display:inline-block;
}
li a:hover{
color:yellow;
}
li a:active{
color:green;
}
a{
text-decoration: none;
}
#open{
margin-right:75px;
background-color: #D2691E;
}