本次网页制作的效果图如上图所示，分析一下该图，我们不难发现，图片大致分为以下几个部分：
1、顶部部分，其中又包括了LOGO、MENU和一幅Banner图片；
2、内容部分又可分为侧边栏、主体内容；
3、底部，包括一些版权信息。
有了以上的分析，我们就可以很容易的布局了，我们设计层如下图:
根据上图，我再画了一个实际的页面布局图，说明一下层的嵌套关系，这样理解起来就会更简单了。
DIV结构如下：
│body {} /*这是一个HTML元素，具体我就不说明了*/
└#Container {} /*页面层容器*/
├#Header {} /*页面头部*/
├#PageBody {} /*页面主体*/
│ ├#Sidebar {} /*侧边栏*/
│ └#MainBody {} /*主体内容*/
└#Footer {} /*页面底部*/
至此，页面布局与规划已经完成，接下来我们要做的就是开始书写HTML代码和CSS。
125jz网原创文章。发布者：江山如画，转载请注明出处：http://www.125jz.com/2371.html
前端框架一般指用于简化网页设计的框架，比如，jquery，extjs，bootstrap等等，这些框架封装了一些功能，比如html文档操作，漂亮的各种控件（按钮，表单等等）。前段框架的好处：对于互联网的产品而言，前端用户体验往往决定了一款产品的竞争力和吸引力;而对于前端工程师来说，考虑的问题更为复杂，他们既要为网站上提供的产品和服务实现一流的Web页面、优化…
联系中国网页设计站长做网站：QQ 41588872 很多企业要做网站，老板先问的是做个网站多少钱？ 这个真没有办法直接回答，因为网站的价格跟网站的定位、功能需求、栏目等是息息相关的，你必须描述清楚你的要求才可以给出大致报价。 因此，首先要明确你做网站的目的是什么？ 1、展示型网站 只是把网站作为一张“网络名片”，让别人知道你有网站，印在名片上，感觉企业高大…
左侧固定，右侧自适应布局效果图 很多页面，特别是网站后台管理页面，不少采用左右布局。本文讲解左侧固定，右侧自适应布局的两种实现方法。 左侧固定200px宽，右侧自适应，中间间隔10px。 HTML: <div class=”parent”> <div class=”side”></div> <div class=”m…
最近几年能看到各行各业越来越多关于知识体系化的文章话题被关注，一定程度上说明在当前社会发展中，大家越来越重视个人知识体系化的积累。本篇文章将围绕知识体系为主题，会涉及到很多不同纬度的知识内容展开。 为什么要构建知识体系 第一，系统化知识，可以帮助我们更高效学习，节省学习中大量不必要的时间； 第二，学习吸收进来的知识点及时纳入体系里，可以让知识记得更加牢固； …
一直不清楚移动端web app和页面用的什么字体，只是觉得类似微软雅黑，直到有一次设计师问到设计移动web页面该用什么字体才严肃地想起这个问题。 三大手机系统IOS、android、winphone支持的字体 ios 系统 默认中文字体是Heiti SC 默认英文字体是Helvetica 默认数字字体是HelveticaNeue 无微软雅黑字体 androi…
微信扫一扫 
支付宝扫一扫 
