我个人理解应用型网页，就是一些用户的个人操作页面，比如说邮箱，博客，后台系统等...
这一类的网页据我观察，貌似都是自适应宽度，在整个网页显示的,这一类网页验证方式（按住ctrl键，滚动鼠标滑轮，发现宽度和高度不是等比例缩放的。）
大概如同上图的布局，在不追求方便搜索引擎操的情况下，操作内容那一块也可以用一个分帧来存放页面，代码如下。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>blog</title>
<style type="text/css">
body, ul, li, h1, h2, h3, h4, h5, h6, p, form, dl, dt, dd { margin: 0px; padding: 0px; font-size: 12px; font-weight: normal; }
ul { list-style: none; }
img { border-style: none; }
body{background:#ccc; font-size:30px;}
#header{height:80px; background:#00f;margin:10px 30px ;}
#search{height:35px;background:gray;margin:0px 30px 10px 30px; text-align:right;}
#navigator{width:270px; float:left;margin-left:30px;height:350px;background:#0f0;}
#right{margin-left:310px;margin-right:30px;height:350px;background:#f00;}
#footer{margin:10px 30px 0 30px;height:80px;background:gray;}
</style>
</head>
<body>
<div id="header">标题</div>
<div id="search">查询栏目</div>
<div id="navigator">导航栏</div>
<div id="right">操作内容</div>
<div id="footer">页脚</div>
</body>
</html>
自己今天突然心血来潮，想把常见的网页布局都做出来，方便布局的时候直接去代码，也方便自己的布局结构思路更清晰，如果有什么不对的，或者不是很好的地方请您留言告诉我，我会尽力改正，谢谢！
96
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
