毕业论文使用div+css开发个人网站

【摘要】 计算机和计算机网络的飞速发展，人们对计算机网络的依赖是越来越大。人们在网上聊天交友，在网上请教问题，查阅资料，还在网上听音乐。除此之外，人们还会在网上进行商务交易、下载信息，有着众多的使用者。尤其是电子商务大大的减少了人们对周围环境的依赖，无论是哪里的网友，都可以浏览到世界各地的各类信息，非常的方便，由于以上的优势，各类网站如雨后春笋般的出现，这也就是我的毕业设计的实际意义。本文就个人网站的规划于建设，以软件工程的方法对过程经行了分析与研究。本文的主要工作集中在：

对web页经行概述，主要是对Internet的历史和发展作了回顾，在web页的定义而后特性上进行阐述。而Web设计的健康发展依靠web标准的采用，没有web标准就不会有真正的可访问性和连贯的设计。不用web标准，就跟不上时代。在这样的标准时代，我们需要网页更加容易扩展，适合自动数据交换，并且更加规整。而css，则实现了页面内容与样式分离。鉴于web标准，本论文着重对div+css布局公司网页进行了讨论。并对网站开发过程中使用的开发工具和技术作了简要的介绍。

对网站建设中提及到术语经行了解释，并对个人网站的由来和发展经行了讨论；对自己的个人网站从规划建设经行了详细的分析；使用Dreameaver、photoshop等技术实现了个人网站的各种功能并且就网站建设提出了自己的观点与建议。

【关键词】网页设计 div+css Dreamweaver 个人网站

目 录

前 言.............................................................. 1 第一章 网站开发背景................................................ 2 第一节 WEB概述 ................................................... 2 一、认识WEB .................................................... 2 二、认识WEB2.0标准 ............................................ 2 第二章 DIV+CSS详解 ................................................ 5 第一节 DIV+CSS简介 ............................................... 5 第二节 级联样式表简介 .......................................... 6 第三节 DIV+CSS布局的优点 ........................................ 6 一、利于搜索引擎蜘蛛爬行 ....................................... 6 二、易于修改 ................................................... 7 三、减少网页加载时间 ........................................... 7 四、代码精简 ................................................... 7 五、相对表格的嵌套问题 ......................................... 8 六、搜索排名的影响 ............................................. 8 第四节 DIV+CSS布局方式 ............................................ 8 第五节 DIV+CSS理论概述 ............................................ 9 一、理解CSS盒子模型 ........................................... 9 二、转变思路 .................................................. 10 三、实现结构与表现分离 ........................................ 11 第六节 DIV+CSS的兼容性问题 ....................................... 11 一、div的垂直居中问题 ......................................... 11 二、margin加倍的问题 .......................................... 11 三、浮动ie产生的双倍距离 ..................................... 11 四、IE与宽度和高度的问题 ...................................... 11 五、页面的最小宽度 ............................................ 12

六、DIV浮动IE文本产生3象素的bug ............................ 12 七、IE捉迷藏的问题 ............................................ 12 八、IE6下为什么图片下有空隙产生 ............................... 12 第二章 开发工具的介绍............................................. 13

第一节 梦幻网页的编织者——Dreamweaver ........................ 13 第二节 图形、图像编辑设计软件制作软件——ADOBE PHOTOSHOP CS2 ...... 13 第三章 网站总体分析和设计......................................... 15 第一节 网站开发的需求分析 ....................................... 15 第二节 网站的总体设计 ........................................... 16 第三节 整体风格设计 ............................................. 19 一、页面属性设计 .............................................. 19 二、色彩搭配 .................................................. 19 三、连接效果 .................................................. 20 四、导航设计 .................................................. 20 五、细节设计 .................................................. 21 第四节 首页设计 ................................................. 21 一、DIV分布和概述 ............................................. 21 二、搜索关键字与描述 .......................................... 23 第五节 其他页面设计 ............................................. 23 第四章 网站的测试.................................................. 29 第五章 后续工作.................................................... 30 结 论............................................................. 31 结束语............................................................. 32 附录一：网站首页效果图............................................. 33 附录二：部分代码................................................... 34

前 言

当今世界已进入信息时代，Internet成为21世纪最受关注的行业之一,它的飞速发展和在全球范围的普及应用正在给人类生活带来革命性变化。网络技术的发展也取得了巨大的成就，为网站开发提供了很好的技术支持。网站已经成为现阶段众多企业不可或缺的网络营销平台，互联网应用规模正不断扩大。其中，特别是中小型企业，对于网络平台搭建的需要求相当的迫切。各大门户网，企业网都在WEB2.0的标准上,采用CSS+DIV来布局网站，所以才有了此次的选题。

论文详细论述了一个基于公司网站的开发的设计过程。在技术上，采用了 Dreamweaver网站开发工具，以 HTML的超大功能结合 JAVAScript 的客户端语言，并加以 FLASH 等动画以增加网站的动态效果。这样的构造有利于以后对网站系统开发的把握，并给以后的开发积累一定的经验，提升编程能力。其中，最主要的就是介绍和展示DIV+CSS在网页中的最用和魅力。

本文实现了首页、新闻、案例、介绍、联系、搜索、留言、联系我们、等功能，全面化个人网站的需求。

论文组织如下：首先阐述了该系统的开发背景、意义，详细介绍了div+css理论知识；其次介绍了相关的开发工具及技术基础；接着对网站的需求进行了分析，并提出了具体的设计方案；然后展现了整个系统的具体实现，包括网页的设计和连接，各功能模块的实现；最后对该网站进行了严格的测试。

1