<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
.header,.footer{ width: 100%; height: 60px; background: seagreen;}
.content{ width: 1000px; min-height: 100%; background:tan; margin: auto; text-align: center;line-height: 60px;}
.container{ width: 100%; height: 500px; background: gray; position: relative;}
.main{ width: 600px; float: left; min-height: 500px; background: aqua; position: absolute;left: 50%;margin-left:-300px ;}
.left{ width: 200px; float: left;min-height: 500px; background:gold; position: absolute;left: 50%;margin-left:-500px ;}
.right{ width: 200px; float: left;min-height: 500px;background: navajowhite;position: absolute;left: 50%;margin-left:300px ;}
</style>
</head>
<body>
<div class="header">
<div class="content">头部</div></div>
<div class="container">
<div class="left">左边</div>
<div class="main">中间</div>
<div class="right">右边</div>
</div>
<div class="footer">
<div class="content">底部</div>
</div>
</body>
</html>
博客列表 >页面布局
页面布局
- 1A7498的博客原创转载
- 2018年03月28日 11:33:20760浏览
声明：本文内容转载自脚本之家，由网友自发贡献，版权归原作者所有，如您发现涉嫌抄袭侵权，请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言，请遵守新闻评论服务协议
