柏林

切版网专注网页切版服务


演示网址:

http://www.qieban.cn/html/buyutianxia

html代码:

<!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-->

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*/
免费索取报价