添加微信好友
演示网址：
http://www.qieban.cn/html/buyutianxia
html代码：
[codesyntax lang=”html4strict”]
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js en">
<!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
content="width=device-width, maximum-scale=1, initial-scale=1, user-scalable=yes">
<title>捕鱼天下官方网站|国内独创跨屏捕鱼平台</title>
<link rel="stylesheet" href="css/bootstrap.min.css" >
<link rel="stylesheet" href="css/style.css" >
<!--[if lt IE 9]>
<script src="js/html5.js" ></script>
<![endif]-->
<script type="text/javascript" src="js/jquery-1.7.2.js" ></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js" ></script>
<script type="text/javascript" src="js/jquery.placeholder.js" ></script>
<script type="text/javascript" src="js/addons.js" ></script>
<script type="text/javascript" src="js/Validform_v5.3.2.js" ></script>
<script type="text/javascript">
try {
var urlhash = window.location.hash;
if (!urlhash.match("fromapp")) {
if ((navigator.userAgent.match(/(iPhone|iPod|Android|ios|iPad)/i))) {
window.location = "http://www.boo-goo.com/m/default.htm";
}
}
} catch (err) {
}
</script>
</head>
<body>
<div class="layout">
<div class="bg">
<div class="img">
<img src="imgs/img2.png" >
</div>
</div>
<div class="header">
<div class="navbg"></div>
<div class="wrap">
<div class="left">
<ul>
<li><strong><a href="#" >官方首页</a></strong></li>
<li><strong><a href="#" >下载中心</a></strong>
<div class="sub">
<dl>
<dd>
<a href="#" >下载桌面端</a>
</dd>
<dd>
<a href="#" >下载ios端</a>
</dd>
<dd>
<a href="#" >下载安卓</a>
</dd>
<dd>
<a href="#" >网页在线玩</a>
</dd>
</dl>
</div></li>
<li><strong><a href="#" >新闻动态</a></strong>
<div class="sub">
<dl>
<dd>
<a href="#" >新闻</a>
</dd>
<dd>
<a href="#" >公告</a>
</dd>
<dd>
<a href="#" >活动</a>
</dd>
</dl>
</div></li>
<li><strong><a href="#" >账号充值</a></strong>
<div class="sub">
<dl>
<dd>
<a href="#" >元宝充值</a>
</dd>
</dl>
</div></li>
</ul>
</div>
<div class="logo">
<a href="#"><img src="imgs/logo.png" ></a>
</div>
<div class="right">
<ul>
<li><strong><a href="#" >比赛专区</a></strong>
<div class="sub">
<dl>
<dd>
<a href="#" >所有比赛</a>
</dd>
<dd>
<a href="#" >我的战绩</a>
</dd>
</dl>
</div></li>
<li><strong><a id="grzx" href="#">个人中心</a></strong>
<div class="sub">
<dl>
<dd>
<a id="jbzl" href="#">基本资料</a>
</dd>
<dd>
<a id="mmxg" href="#">密码修改</a>
</dd>
<dd>
<a id="tggl" href="#">推广管理</a>
</dd>
</dl>
</div></li>
<li><strong><a href="#" >帮助中心</a></strong>
<div class="sub">
<dl>
<dd>
<a href="#" >新手入门</a>
</dd>
<dd>
<a href="#" >游戏说明</a>
</dd>
<dd>
<a href="#" >相关问题</a>
</dd>
</dl>
</div></li>
<li><strong><a href="#" >关于我们</a></strong>
<div class="sub">
<dl>
<!--// <dd>
<a href="contact.jsp">联系方式</a>
</dd>
<dd>
<a href="about.jsp">关于我们</a>
</dd>
<dd>
<a href="http://wpa.qq.com/msgrd?V=3&uin=79222707&Site=QQ客服&Menu=yes">在线客服</a>
</dd>-->
</dl>
</div></li>
</ul>
</div>
</div>
</div>
<!--//header-->
[/codesyntax]
css代码：
[codesyntax lang=”css”]
.header{
background:url("../imgs/img3.png") no-repeat center top; height:66px; clear:both; position:relative;
}
.header .navbg{
background:url("../imgs/img103.png") no-repeat center top; height:268px; width:100%; position:absolute; left:0; top:66px; display:none;
}
.header-selected .navbg{
display:block;
}
.header .wrap{
position:relative;
}
.header .left,.header .right{
width:375px; float:left; display:inline;
}
.header .logo{
width:230px; height:auto; overflow:hidden; float:left; display:inline; text-align:center; padding-top:15px;
}
.header li{
float:left; display:inline; width:25%; position:relative;
}
.header li strong{
height:66px; line-height:66px; font-size:16px; font-weight:normal; text-align:center; display:block;
}
.header li strong a{
color:#8dafc6;
}
.header li strong a:hover,.header li.selected a{
color:#00f0c1;
}
.header li.selected .sub{
display:block;
}
.header li .sub{
position:absolute; left:0; top:66px; width:100%; display:none;
}
.header li .sub dd{
line-height:30px; font-size:14px; text-align:center; display:block;
}
.header li .sub dd a{
color:#bfd9ec; text-shadow:#004279 1px 1px 5px;
}
.header li .sub dd a:hover{
color:#fff;
}
/*//header*/
.footer{
text-align:center; clear:both; border-top:4px solid #939393; padding:20px 0; line-height:31px; color:#313131; font-size:14px; margin-top:40px; height:auto; overflow:hidden;
}
/*//footer*/
.page{
clear:both; margin-top:300px;height:auto; overflow:hidden;
}
.aside{
float:left; display:inline; width:220px; height:auto; overflow:hidden;
}
.aside .down{
height:105px;
}
.aside .down a{
background:url("../imgs/img4.png") no-repeat left top; width:220px; height:105px; display:block;
}
.aside .down a:hover{
background-position:left bottom;
}
.aside .reg{
height:73px; margin-top:20px;
}
.aside .reg a{
background:url("../imgs/img5.png") no-repeat left top; width:220px; height:73px; display:block;
}
.aside .reg a:hover{
background-position:left bottom;
}
.aside .denglu {
height: 64px;
}
.aside .denglu a{
background:url("../imgs/img6.png") no-repeat center top; width:206px;height: 64px;display:block;
}
.aside .denglu a:hover{
background-position:center bottom;
}
.aside .down img,.aside .reg img,.aside .kjtd .btn img{
clear:both;
}
.aside .kjtd{
margin-top:20px; height:auto; overflow:hidden;
}
.aside .kjtd .btn{
height:64px; text-align:center;
}
.aside .nav li{
float:left; width:50%; text-align:center; height:33px; line-height:33px; background:url("../imgs/img7.png") no-repeat center; margin-top:8px; font-size:14px;
}
.aside .nav li a{
color:#fff;
}
.aside .top_user{
margin-top:20px; height:auto; overflow:hidden; border:1px solid #c9c9c9; padding:5px 0 10px 0;
}
.aside .top_user table{
text-align:center; line-height:27px; font-size:14px; color:#000;
}
.aside .top_user table th{
text-align:center; line-height:35px;
}
.aside .ads{
height:55px; margin-top:20px;
}
.aside .kfzq{
height:auto; overflow:hidden; margin-top:20px;
}
.aside .kfzq .hd{
background:url("../imgs/img8.png") no-repeat left center; padding-left:30px; height:20px; line-height:20px; font-size:16px; color:#333333
}
.aside .kfzq .bd{
height:auto; overflow:hidden; padding-top:5px; color:#333333; font-size:14px;
}
.aside .kfzq .bd span{
padding-right:25px;
}
.aside .kfzq .bd p{
padding-top:8px;
}
.aside .btn_qq{
background:url("../imgs/img9.png") no-repeat 54px 18px #536687; padding-left:85px; height:60px; line-height:60px; margin-top:18px;font-size:18px; color:#fff;
}
.aside .btn_qq a{
color:#fff;
}
/*//aside*/
[/codesyntax]
文章为原创或者来自于互联网，转载请注明来源，如果文章有侵权请联系，我们会及时删除。
