基础的网页设计与制作-论文.doc
8页
基础的网页设计与制作-论文 信息工程与自动化学院 计算机科学技术 专业 2005 级 学生姓名： ** 毕业设计（论文）题目： 基础的网页设计与制作 毕业设计（论文）内容： 制作一个动物网页，包括 动物 简介， 动物成语， 动物论坛，动物探索等有关动物的科普 信息的内容页面还包括图片、 链接、多媒体等非文字的元素，此网 页采用flash以增加网页 的动态效果专题（子课题）题目：动物科普小知识 专题（子课题）内容： 根据登录用户的不同要求去查询各种动物的信息内容，用户可通过该网站更加喜欢动物，及 增加动物保护意识本网站建立了各种内容的 题材网址，使登录用户方便，快捷地查找他们 所需的内容毕业设计（论文）指导教师（签字）： 摘要在当今的世界上,智慧的人类应该有序地调整人与动物的关系,使我们所生存的世界的动物种类完整而健全也更使我们强化了人类和动物是朋友的理念，因为我们明晰了：所有的生物界的生命都是有着一种链式的、因果关联的一种缘分。
使得我们更为形象地理解了生物链的意义、生物的多 样性、 环境和 发展的意义地球是一个大家园，因为有所有的 动物，地球才不会失衡人 类发展很快，在我们建设美好家园的同时应该给动物们留下生存的空间这里我 们制作的网页展示了不同内容的信息这些动物科普知 识将增加人们的保护动物的意 识它将比 较全面地介绍一个网页，使用户更方便更快捷地 查找所需内容关键字：动物简介 宠物之家 珍稀动物 动物成语前言本网页是用Dreamweaver 及flash制作的一个动物世界的科普知识的网页本网页以建立一个多内容，多 题材的动物知识网站为目的，此应用系统尽力达到界面直观，操作方便，符合不同人群的需求，同时具有一定的娱乐性Dreamweaver是集网 页制作和管理网站于一身的所 见即所得网页编辑器，它是第一套针对专业网页设计师特别发展的视觉化网页开发工具，利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页因此我们有效利用了Dreamweaver 的直观性，使用方便，容易上手，更 换方便的特点制作了一个使登录用户能方便，快捷的页面，同时能让人们更加喜欢和爱护 小动物们，以增加人们的保护意识。
在次我们实现 了与其他网站相连接的互 动功能更关 键的是这个网页体现了Dreamweaver 的 实际应用及采用 flash 技术增加了页面的动态效果和页面的美观我们还运用样 式表单CSS来对页面元素进行布置所以这个网站将全面地说明一个网站的应用系统的结构更快捷地 查找所需内容目录第一章 诸论. 0 1．设计思想. 0 2．开发工具的选用及介绍. 0 3． 网页设计的色彩. 0 第二章 dreamweave的发展. 0 第三章 网站总体分析与设计. 0 1网站系统分析. 0 2主页设计. 0 3背景分析. 0 4网页设计的色彩. 0 第四章 详细设计. 0 第五章 为什么选择dreamweaver 0 第六章 设计方案. 0 1模板创建. 0 2页面制作. 0 3框架技术. 0 4表格设计. 0 6超级链接. 0 7 Flash 的制作过程. 0 第七章 总结与体会. 0 总结. 0 心得体会：. 0第一章 诸论在Internet飞速 发展的今天，互 联网成为人们快速获取、发布和传递信息的重要渠道， 它在人们政治、经济、生活等各个方面发挥着重要的作用Internet 上发布信息主要是通过网 站来实现的，获取信息也是要在Internet“ 海洋” 中按照一定的 检索方式将所需要的信息从网 站上下载下来。
因此网站建设 在Internet应用上的地位显而易见，它已成为政府、企事业单位 信息化建设中的重要组成部分，从而倍受人 们的重视 为了更好网站，提高网站知名度，所 以我们精心策划了本网站 Dreamweaver是制作主页 的好工具.Dreamweaver是可视化的网页制作工具， 很容易上手，可以让你轻松地制作出自己的网 页Dreamweaver 在多媒体方面颇 有建树的Macromedia公司推出的可 视化网页制作工具，它与Flash、Fireworks合 在一起被称为网页制作三剑客，这三个软件相辅相承，是制作网页的最佳选择其中，Dreamweaver主要用来制作网 页文件，制作出来的网页兼容性比较好，制 作效率也很高，Flash用来制作精美的网 页动画 1．Dreamweaver的发展 1．1 1997年首次推出 1．2 2000年推出Dreamweaver UltraDev: 运用其核心的 Roundtrip HTML 技術，可确保在切换程式设计检时的程式码品质，Dreamweaver 成专业网站外观设计的先驱Macromedia 针对多种日益受到网页发展人员用的伺服器技术，而推出了 Dreamweaver UltraDev。
本 产品除了提供 Dreamweaver 的功能外， 还提供以 ASP、JSP 和 ColdFusion 建立网页应用程式的工具 1．3. 2002年5月推出Dreamweaver MX: 目的是支援现代网页肩负的多重角色Dreamweaver MX 將 UltraDev 最佳的开发功能以及 HomeSite 的主要程式编辑功能整合為一个核心的 Dreamweaver 环境,为建立单一开发环境的第一步，以期让使用者能在此环境中，依其偏好的方 式以手動来建立不同的网站和应用程式 1．4. 2003年9月推出Dreamweaver MX 2004: 新增了以 CSS 为基础的设计性开发提供支援的革命性功能，将网页设计提升到新的位置透过 將 CSS 結合在所有使用者的工作流程中，促进了网 页专业人员对 CSS 的普遍採用 1．5.推出Dreamweaver 8.0: 以之前版本为基础，扩充了主要范围的功能，例如 XML 和 CSS，并简化了工作流程，以幫助使用者事半功倍由支援最新的 专业设计方式， Dreamweaver 8 為使用者提供以开放标准基礎的强大开发方式，增強了专业性的基本工具。
另外 ，Dreamweaver 也支援所有主要的伺服器技术，包括 ColdFusion、PHP、ASP、ASP.NET 和 JSP，让 各种能力程度的开发人员，无论是新手或老手，都能实现其设计 2． 设计思想通过网站，全面宣传，展示动物风采、优点与特色，发布动物的重大活动安排与生活习性， 增强人们的保护意识，使人们 更多了解动物,在Internet 上实现完成部分介绍及宣传活动，提 高人与动物和谐发展3．开 发工具的选 用及介绍Dreamweaver是制作主 页的好工具.Dreamweaver 是可视化的网 页制作工具，很容易上 手，可以让你轻松地制作出自己的网页Dreamweaver 在多媒体方面 颇有建树的Macromedia 公司推出的可视化网页制作工具，它与Flash 、Fireworks 合在一起被称 为网页制作三剑客， 这三个软件相辅相承，是制作网页的最佳选择其中，Dreamweaver主要用来制作网页文件 ，制作出来的网页兼容性比较好，制作效率也很高，Flash用来制作精美的网 页动画，而Firew orks用来 处理网 页中的图形工具介绍如下： 采用的工具 css html flash1]． Css简介层叠样式表 (CSS) 是一系列格式设置规则，它 们控制 Web 页面内容的外观。
使用 CSS 设置页面格式时，请将内容与表 现形式分开 页面内容（即 HTML 代码）驻留在 HTML 文件自身中，而用于定义代码 表现形式的 CSS 规则驻留在另一个文件（外部样式表）或 HTML 文档的另一部分（通常为文件头部分）中使用 CSS 可以非常灵活并更好地控制具体的页面外观，从精确的布局定位到特定的字体和 样式CSS 允许控制 HTML 无法独自控制的许多属性 除设置文本格式外，还可以使用 CSS 控制 Web 页面中块级别元素的格式和定位l CSS 的主要优点是: 它提供了便利的更新功能；更新一处的 CSS 规则时，使用该已定义样式的所有文档的格式都会自 动更新 为新样式 l 外部 CSS 样式表是一系列存储在一个单独的外部 CSS (.css) 文件（并非 HTML 文件）中的 CSS 规则 利用文档文件头部分中的链接，该文件被链接到 Web 站点中的一个或多个页面 l 内部（或嵌入式）CSS 样式表是一系列包含在 HTML 文档文件头部分的 style 标签内的 CSS 规则l 字体大小的css的代码如下：字体大小属性 font-sizeBODY{font-size:10pt} .s1 {font-size:16px}.s2 {font-size:16pt} .s3 {font-size:80%} .s4 {font-size:larger} .s5 {font-size:xx-large}这段文字大小是10pt。
这段文字大小是16px这段文字大小是16pt这段文字大小是10pt的80%这段文字的大小比10pt大这段文字的大小是特大号(xx-large) 2]．网页和Html 语言我们的网页是用html语言编写的一个关于动物的网站，html 中文翻译为“超文本标记语 言”，所谓“ 超文本“ 就是指页面内可以包含图片，链接，多媒体等非 问字的元素，通 过html 语 言将这些元素表示出来，就形成了html 代码 浏览器的工作主要是将这些标记语言进行”翻 译“，并按照定 义的格式显示出来， 这就是我们所看到的网 页HTML的结构包括头部（Head）、主体（Body）两大部分，其中头部描述浏览器所需的信 息，而主体则包含所要说明的具体内容 另外，HTML 是网络的通用语言,一种简单、通用的全置标记语言它允 许网页制作人建立文 本与图片相结合的复杂页面， 这些页面可以被网上任何其他人 浏览到，无 论使用的是什么类 型的电脑或浏览器其主要特点如下：1、简 易性，HTML 版本升 级采用超集方式，从而更加灵活方便 2、可扩展性，HTML 语言的广泛 应用带来了加强功能，增加 标识符等要求，H TML采取子类元素的方式， 为系统扩展带来保证。
3、平台无关性虽然PC 机大行其道，但使用MAC 等其他机器的大有人在，HTML 可以使用在广泛的平台上 下面是一个层的 HTML 代码 示例： Sample Layers Page #Layer1 { position:absolute; left:62px; top:67px; width:421px; height:188px; z-index:1; 。
