环绕式布局更加灵活方便，banner区域相对较小，但是可以在页面中安置更多的信息和内容，这种布局适合内容较多或者以内容为主的网站。下面介绍网页怎样布局，希望可以为您带来帮助。
[图片0]
布局一、大框套小框。
这种布局是很多网站都常使用一种布局方式，在一个大的栏目里然后在布局几个小的相关栏目，这种布局方式大小有限，让用户专注于某一方面的内容，主体突出。
布局二、环绕式布局。
环绕式布局更加灵活方便，banner区域相对较小，但是可以在页面中安置更多的信息和内容，这种布局适合内容较多或者以内容为主的网站。
布局三、穿插式布局。
这种布局在企业网站中不常用，也不适合企业网站，这种网站就是banner的区域较大，灵活性相对差些。
布局四、通栏布局。
这种布局方式相对于大框套小框而言，用户浏览网页不在受到方框的限制，这种方式显得大气些，眼界显得更开阔些。
另外这种方式还有一个便利之处那就是主视觉部分可以随机灵活处理，既能往上移到网站logo和导航的位置，也可以移到向下扩展的内容区域。这种布局方式也是网站中常用的布局方式。
布局五、左中右布局。
这种布局方式也不常见，但也是一种新鲜的布局方式，这种布局比较有条理，逻辑性较强。
布局六、导航在主视觉下方的布局。
这种布局方式在一些资讯门户网站中还是比较常见的，导航直接放置在banner的下面，这可以弥补banner中设计素材被截断的缺陷。
另外这种布局方式，用户打开网页就能看到网站的导航，这样对于新客户来说是及其友好的，新客户不用刻意去寻找网站的导航，而且访客可以通过第一眼就能分清网站主要导航内容。
2如何设置页面布局
打开准备好的word文档，切换到“页面布局”选项卡下，单击页面设置组中右下角的对话框启动器，这个时候会弹出一个对话框。
在弹出的“页面设置”对话框中，切换到“页边距”选项卡下，然后将上下页边距设置为厘米，左右页边距设置为厘米，其他选项默认选择即可。
在弹出的“页面设置”对话框下，切换到“纸张”选项卡下，在纸张大小下拉列表中选择A4选项。在“页面布局”选项卡下，选择“纸张大小”选项，也可设置纸张的大小。
在弹出的“页面设置”对话框下，切换到“版式”选项卡下，然后在页眉和页脚微调框中进行输入相对应的值，在此输入页眉和页脚距离边界厘米。
同样在“页面布局”选项卡下，也可以对页边距进行设置。点击页面布局选项卡下的“页边距”选项，选择“自定义边距”，也可以弹出上一步的“页面设置”对话框，进行相应的设置。
切换到“设计”选项卡下，单击页面背景组中的“页面颜色”选项，在弹出的下拉列表中选择任意一个自己喜欢的颜色，进行设置，这样就大体设计好了。
3如何通过DIV来布局页面
我们先在一个容器里输入三个div。
如果不添加样式，直接打开页面，我们的三个div是以块来显示的，即每个div占用一块，是竖排的。
[图片1]
为了让div能像table那样，横排来布局页面，我们可以添加样式，为div添加 float:left的样式，让div能横排。
刷新页面，可以看到现在的三个div都能横排了。
还需要设置一下各div的宽度。我们为left, right， middle三个div各设置不同的宽度。
刷新页面，可以看到现在三个div已经可以把容器分成三列的布局了。
细节上再修正一下，把中间div的左右二边的边框设置为none，现在看起来更好点了。
4网页排版布局的原则
1.平衡性
(1)文字、图像等要素的空间占用上分布均匀
(2)色彩的平衡，要给人一种协调的感觉。
2.对称性
对称是一种美，我们生活中有许多事物都是对称的。但过度的对称就会给人一种呆板、死气沉沉的感觉，因此要适当地打破对称，制造一点变化。
3.对比性
让不同的形态、色彩等元素相互对比，来形成鲜明的视觉效果。例如黑白对比，圆形与方形对比等，它们往往能够创造出富有变化的效果。
4.疏密度
网页要做到疏密有度，即平常所说的“密不透风，疏可跑马”。不要整个网页一种样式，要适当进行留白，运用空格，改变行间距、字间距等制造一些变化的效果。
5.比例
比例适当，这在布局当中非常重要，虽然不一定都要做到黄金分割，但比例一定要协调。
