本次网页制作的效果图如上图所示，分析一下该图，我们不难发现，图片大致分为以下几个部分：
1、顶部部分，其中又包括了LOGO、MENU和一幅Banner图片；
2、内容部分又可分为侧边栏、主体内容；
3、底部，包括一些版权信息。
有了以上的分析，我们就可以很容易的布局了，我们设计层如下图:
根据上图，我再画了一个实际的页面布局图，说明一下层的嵌套关系，这样理解起来就会更简单了。
DIV结构如下：
│body {} /*这是一个HTML元素，具体我就不说明了*/
└#Container {} /*页面层容器*/
├#Header {} /*页面头部*/
├#PageBody {} /*页面主体*/
│ ├#Sidebar {} /*侧边栏*/
│ └#MainBody {} /*主体内容*/
└#Footer {} /*页面底部*/
至此，页面布局与规划已经完成，接下来我们要做的就是开始书写HTML代码和CSS。
125jz网原创文章。发布者：江山如画，转载请注明出处：http://www.125jz.com/2371.html
对于视觉次序（视觉层次）的营造是每个设计师所必须精通的，无论是海报设计还是页面设计，从整体来看总会有强弱、主次之分，因为有了视觉上的变化，才使得整体更富有层次感；当用户在浏览信息很多的网页时，作为设计师要做到：即使用户只是简单的浏览，也要有能在用户脑海中形成记忆的视觉元素，而这些元素就是视觉中的主，而当用户仔细阅读时才能记忆到的元素才是视觉上的次；从局部来说…
在开始学习之前，请加入网页设计交流群：208047327 ，并注册本站用户，在项目制作过程中有任何问题，可以在群内讨论，或进入本站问答社区互动。 【时间要求】 2 学时（ 45 分钟× 2=90 分钟） 【上机内容】 个人站点制作 【上机目的】1 、了解网页的组成2 、掌握网站的目录结构3 、掌握表格布局方法和技巧4 、掌握HTML及CSS的基础知识5、培养…
【时间要求】 2 学时（ 45 分钟× 2=90 分钟） 【上机内容】 中融宝企业网站制作 【上机目的】 1 、掌握网页布局的方法和技巧 2 、掌握HTML及CSS的使用 3、掌握表单及表单元素的使用 4、培养团队意识和协作精神 【上机重点】 1 、网页布局 2 、表单制作 3 、HTML及CSS的使用 【上机难点】 1、网页布局 2、CSS的定义和使用 【…
微信扫一扫 
支付宝扫一扫 
