博客列表 >html后台搭建

html后台搭建

1A7498的博客
1A7498的博客原创
2018年03月22日 09:44:581446浏览
<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>php后台管理</title>
		<link rel="stylesheet" type="text/css" href="main.css" />
	</head>

	<body>
		<div class="top_box"><iframe src="top.html" name="top" height="100%" width="100%" frameborder="0" scrolling="no"></iframe></div>
		<div class="left_box">
			<iframe src="left.html" name="left" height="100%" width="200" frameborder="0" scrolling="no"></iframe>
		</div>
		<div class="right_box">
			<iframe src="right.html" name="right" height="100%" width="100%" frameborder="0" ></iframe>
		</div>
	</body>

</html>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="main.css"/>
	</head>
	<body>
		<div class="logo"><img src="logo-zfb.png"/></div>
		<div class="admin">
			<ul>
				<li><a  href="#">admin</a  href="#"></li>
				<li><a  href="#">退出</a  href="#"></li>
			</ul>
		</div>
	</body>
</html>
<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="main.css" />
	</head>

	<body>
		<ul class="leftbox">
			<li>
				<a>首页</a>
			</li>
			<li>
				<a href="#">商户管理</a>
				<div class="shgl">
					<ul>
						<li>
							<a href="#">商户列表</a>
						</li>
						<li>
							<a href="#">添加商户</a>
						</li>
					</ul>
				</div>
			</li>

			<li>
				<a href="#">订单管理</a>
				<div class="ddgl">
					<ul>
						<li>
							<a href="#">用户充值订单</a>
						</li>
						<li>
							<a href="#">商户体现订单</a>
						</li>
						<li>
							<a href="#">管理员体现订单</a>
						</li>
					</ul>
				</div>
			</li>

			<li>
				<a href="#">渠道管理</a>
				<div class="qdgl">
					<ul>
						<li>
							<a href="#">渠道信息</a>
						</li>
					</ul>
				</div>
			</li>

			<li>
				<a href="#">利润统计</a>
				<div id="lrtj">

					<ul>
						<li>
							<a href="#">交易曲线</a>
						</li>
						<li>
							<a href="#">管理员账户</a>
						</li>
					</ul>
				</div>
			</li>

		</ul>
	</body>

</html>
<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="main.css"/>
	</head>

	<body>
		<div class="rightbox">
			<div class="cue">最近交易记录</div>
			<div class="rightboxtj">
				<ul class="jrjy">
					<li>交易金额:¥50000</li>
					<li>体现金额:¥48000</li>
					<li>当日交易</li>
				</ul>
				<ul class="zrjy">
					<li>交易金额:¥50000</li>
					<li>体现金额:¥48000</li>
					<li>昨日交易</li>
				</ul>
				<ul class="zzjy">
					<li>交易金额:¥50000</li>
					<li>体现金额:¥48000</li>
					<li>本周交易</li>
				</ul>
				<ul class="yrjy">
					<li>交易金额:¥50000</li>
					<li>体现金额:¥48000</li>
					<li>本月交易</li>
				</ul>
			</div>
		</div>
	</body>

</html>
/*320.html*/
*{list-style: none; margin: 0; padding: 0; text-decoration: none;}
html body {height: 100%; padding: 0; margin:0; width: 100%;}
.top_box { width: 100%; height: 50px; border-bottom: 2px solid #e4e4e4;}
.left_box{float: left; height: 1200px; background: #3668a9; width: 200px; }
.right_box{ height: 1200px;  width:100%; position: absolute;left: 200px;right: 70px;}

/*top.html*/
.logo { float: left; width: 100px; background-color:#5aa3d9; width: 200px; text-align: center; height: 46px; padding-top: 4px;}
.admin { float: right;  width: 200px; height: 50px;}
.admin ul { width: 200px;}
.admin ul li{ float: left; padding:0 10px; width: 50px;}
.admin ul li a { width: 50px; height: 100px; text-align: center; line-height: 50px; color: #b1b1b1;}



/*left.html*/
.leftbox{ width: 200px; }
.leftbox a{ width:180px; height: 50px; display: block; background: #5aa3d9; border-bottom: 1px solid white;  line-height: 50px; padding-left: 20px; color: white;}
.leftbox a:hover{background:#2f5da0;}
.shgl,.ddgl,.qdgl,.lrtj{display: none;}


/*right.html*/
.rightbox { width: 100%; background: #f2f2f2; height: 1200px;}
.cue{width:150px; height:30px;padding: 20px 0 0 40px;}
.rightboxtj {padding: 40px;  width: 100%; height: 150px;}
.rightboxtj ul{ float: left; width: 200px; height: 150px; border-radius: 10px ; background: white; overflow: hidden;margin-right: 60px;}
.rightboxtj ul li { height: 50px; border-bottom: 1px solid #e4e4e4; text-align: center; line-height: 50px; color: #777c9e;} 
.rightboxtj ul li:last-child{border: none; background: #5d75d2; color: white;}

http://981336937.host50.ldvps.com/php/320/320.html

声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议