本次网页制作的效果图如上图所示，分析一下该图，我们不难发现，图片大致分为以下几个部分：
1、顶部部分，其中又包括了LOGO、MENU和一幅Banner图片；
2、内容部分又可分为侧边栏、主体内容；
3、底部，包括一些版权信息。
有了以上的分析，我们就可以很容易的布局了，我们设计层如下图:
根据上图，我再画了一个实际的页面布局图，说明一下层的嵌套关系，这样理解起来就会更简单了。
DIV结构如下：
│body {} /*这是一个HTML元素，具体我就不说明了*/
└#Container {} /*页面层容器*/
├#Header {} /*页面头部*/
├#PageBody {} /*页面主体*/
│ ├#Sidebar {} /*侧边栏*/
│ └#MainBody {} /*主体内容*/
└#Footer {} /*页面底部*/
至此，页面布局与规划已经完成，接下来我们要做的就是开始书写HTML代码和CSS。
125jz网原创文章。发布者：江山如画，转载请注明出处：http://www.125jz.com/2371.html
125网页设计今天给大家推荐几个毛笔字生成器，毛笔字在线生成网站： http://www.51poca.com/ http://www.epinv.com/online/ http://www.akuziti.com/mb/ 毛笔字改造使用方法 将下载下来的字体图片AI转路径，编辑文字。 首先使用在线生成器输入选择好你需要的文字字形，将文字图片拖至AI中。 …
彩搭配在设计中很重要！不同的配色方案呈现出不同的效果，搞定配色！请学习最好的配色教程 色彩模式 1、RGB色彩模式。通过光的三原色相加混合产生的。显示器的所有色彩都是通过红色、绿色、蓝色这三原色混合来显示的。 2、CMYK 色彩模式。是指墨水或颜料的三原色加上黑色这四种颜色，混合后出现的色彩。CMYK是打印机等印刷设备使用的色彩模型。 3、索引色…
前端侧重于人机交互和用户体验，后端侧重于业务逻辑和大规模数据处理。理论上，面向用户的产品里，所有问题（包括产品、设计、后端、甚至看不见的问题）的表现形式，都会暴露在前端，而只有部分问题（数据问题、计算问题、安全问题等）暴露在后端，这就意味着前端起到了至关重要的承载和连接作用。 一、前端开发流程 需求评审 一般在做需求评审时，PRD里只有交互稿，尚未有视觉稿。…
一个好的网站是一个有效的销售工具，它能够吸引更多的网民的注意。就好像一篇好的文章或者广告，他必须首先引起读者的兴趣，然后引导他们去做出某种行为。因此，不能忽视网站主页面的重要性，否则，网站让浏览者会很快失去兴趣。这样的网站，有可能赢得很高的点击率，但却不能制造预期般的回应，更不用说让网民着迷，进入下一级页面了。 与此类似，一个成功的网站也有几点要素。下面是设…
做WEB前端开发需要掌握哪些知识和技能？ 中国网页设计通过对大型软件企业及IT培训机构（Oracle）的调研，把web前端开发需要的技能点列举如下。 HTML HTML简介 HTMl结构 HTML常用标签 HTML框架 HTML表格标签 HTML表单 HTML多媒体 CSS css简介 css的基本使用 css选择器 css常用样式属设置 CSS定位与DIV…
微信扫一扫 
支付宝扫一扫 
