个人主页制作.docx

1、个人主页制作xx 学院课程实训报告实训题目 :个人主页制作系 部 电气与信息工程系专 业 班 级 电子信息学 号姓 名 xxx指 导 教 师 xxx完 成 日 期 2016 年 1 月 8 日课程实训任务书专业 电子信息 班级 课程名称 网页制作设计题目 个人主页制作 指导教师 xxx起止时间2016年1 月 4 日至 1月 15 日周数 2 周 设计地点 实验室设计目的：掌握网页制作过程、掌握网页制作软件的使用，了解软件的使用和用途。设计任务或主要技术指标：1. 网页制作软件的灵活使用。2. 掌握制作的过程的顺序和流程；设计进度与要求：第 1-2 天：布置任务，查找相关资料；第 3-5 天：

2、熟悉网页制作软件，研究软件功能；第 6-7 天：查找相关资料，撰写课程设计报告；第 8-10 天：进行答辩；主要参考书及参考资料：1 胡崧. HTML 从入门到精通 M. 北京：中国青年出版社， 20072 知新文化. HTML 完全手册与速查辞典 M. 北京：科学出版社， 20073 杨选辉.网页设计与制作教程 M. 北京：清华大学出版社， 20094 王诚君，刘振华，郭竑晖，高中山 .Dreamweaver 8 网页设计应用教程 M. 北京：清华大 学出版社， 2007教研室主任（签名） 系（部）主任（签名） 年 月 日课程实训评定意见实训题目： 个人主页制作学生姓名： xxx专业： 电子

3、信息工程技术 班级： 电子信息评定意见：评定成绩：指导教师（签名）： 年 月 日摘 要Dreamweaver，简称“DW”，中文名称 梦想编织者 ，是美国 MACROMEDIA公司开发的集网页制作和管理网站于一身的所见即所得网页编辑器， DW是第一套针对专业网页设计师特别发展的视觉化网页开发工具， 利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。 本次实训主要制作个人简历的网页， 掌握网页制作过程、 掌握网页制作软件的使用， 了解软件的使用和用途。关键词：Dreamweaver 个人简历 网页制作第一章引言 .1.1.1 什么是 Dreamweaver.1.1.2 Dr

4、eamweaver功能介绍 .1.1.3Dreamweaver的优缺点 .3.第二章主页介绍 .8.2.1 站点 .8.2.1.1 创建站点 . 82.1.2 创建站点内容 . 92.2 首页 .9.2.2.1 设置首页的页面属性 . 92.2.2 插入图像 . 92.2.3 插入多媒体 . 102.2.4 插入文本 . 112.3 创建其它网页 .1.2.2.4 建立网页链接 .1.2.总结.1.4.致谢.1.5.参考文献.1.6.个人主页制作第一章引言3. 什么是 DreamweaverDreamweaver，简称“DW”，中文名称 梦想编织者 ，是美国 MACROMEDIA公司开发的集网

5、页制作和管理网站于一身的所见即所得网页编辑器， DW是第一套针对专业网页设计师特别发展的视觉化网页开发工具， 利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。 Macromedia公司成立于 1992 年，2005年被 Adobe公司收购。 Adobe Dreamweaver使用所见即所得的接口，亦有 HTML（标准通用语言下的一个应用）编辑的功能。它有系统的版本。随 Macromedia被收购后， Adobe也开始计划开发版本的 Dreamweaver了。Dreamweaver自 MX版本开始，使用了排版引擎 Presto 作为网页预览。4. Dreamweaver

6、功能介绍功能特色，借助共享型用户界面设计 , 在AdobeCreativeSuite4 的不同组件之间更快、 更明智地工作。 使用工作区切换器可以从一个工作环境快速切换到下一个环境。具体功能， CS6新增功能，利用 AdobeDreamweaverCS软6 件中改善的FTP性能，更高效地传输大型文件。更新的“实时视图”和“多屏幕预览”面板可呈现 HTML5代码，使您能检查自己的工作。 自适应网格， 可响应的自适应网格版面，使用响应迅速的 CSS3自适应网格版面，来创建跨平台和跨浏览器的兼容网页设计。 利用简洁、 业界标准的代码为各种不同设备和计算机开发项目， 提高工作效率。直观地创建复杂网页设

7、计和页面版面，无需忙于编写代码。改善 FTP性能，利用重新改良的多线程 FTP传输工具节省上传大型文件的时间。 更快速高效地上传网站文件，缩短制作时间。 Catalyst 集成，使用 Dreamweaver中集成的面板连接并编辑您利用需另外购买建立的网站。 利用托管解决方案建立电子商务网站。增强型移动支持使用更新的移动框架支持为 IOS和Android 平台建立本地应用程序。建立触及移动受众的应用程序， 同时简化您的移动开发工作流程。 更新的支持更新的支持可轻松为 Android 和 IOS建立和封装本地应用程序。 通过改编现有的 HTML代码来创建移动应用程序。使用 Phone模拟器检查您的

8、设计。CSS3转换, 将 CSS属性变化制成动画转换效果，使网页设计栩栩如生。在您处理网页元素和创建优美效果时保持对网页设计的精准控制。 更新的实时视图使用更新的“实时视图”功能在发布前测试页面。 “实时视图”现已使用最新版的转换引擎， 能够提供绝佳的 HTML5支持。更新的多屏幕预览面板利用更新的 “多屏幕预览” 面板检查智能手机、 平板电脑和台式机所建立项目的显示画面。 该增强型面板能够让您检查 HTML5内容呈现。 CS5后的新增功借助1个人主页制作AdobeDreamweaverCS5.5软件充满自信地进行设计、构建最新的 HTML5和 CSS3网站、令交互性更上一层楼。同时为多个设备

9、进行设计， 并对全面的代码检查充满自信。 多屏幕预览面板借助多屏幕预”面板，为智能手机、 Tablet 和个人计算机进行设计。借助媒体查询支持，开发人员可以通过一个面板为各种设备设计样式并实现渲染可视化。CSS3/HTML5支持, 通过 CSS面板设置样式，该面板经过更新可支持新的 CSS3规则。设计视图现支持媒体查询，在您调整屏幕尺寸的同时可应用不同的样式。使用 HTML5进行前瞻性的编码， 同时提供代码提示和设计视图渲染支持。 集成借助代码提示加入高级交互性。是行业标准 JavaScript 库，允许您为网页轻松加入各种交互性。借助针对手机的起动模板快速启动。借助构建本机 Android

10、和IOS应用程序。 借助新增的 Phone功能为 Android 和IOS 构建并打包本机应用程序。借助 Phone构建本机 Android 和 IOS应用程序。 新增功能， 实时视图新增功能，借助 DreamweaverCS4中新增的实时视图在真实的浏览器环境中设计网页 ,同时仍可以直接访问代码。 呈现的屏幕内容会立即反映出对代码所做的更改。 针对和框架的代码提示新增功能。借助改进的 JavaScript 核心对象和基本数据类型支持, 更快速、准确地编写 JavaScript 。通过集成包括 Prototype 和流行框架 ,充分利用 DreamweaverCS4的扩展编码功能。 相关文件新

11、增功能， 源代码, 在“设计”视图中查看父页面。集成编码增强功能领略内建代码提示的强大功能 , 令框架、原型和几种服务器语言中的编码更快、更清晰。代码导航器新增功能新增的 “代码导航器” 功能可显示影响当前选定内容的所有代码源 , 如CSS规则、服务器端包括、外部 JavaScript 功能、模板、源文件等。创作支持新增功能在 DW中直接新建基于 HTML和应用程序。在 Dreamweaver中即可预览 AIR 应用程序。使应用程序随时可与 AIR 打包及代码签名功能一起部署。 FLV支持增强功能通过轻松点击和符合标准的编码将FLV集成到任何网页中 - 无需软件知识。设计时在 Dreamwea

12、ver全新的实时视图中播放 FLV影片。支持领先技术，在支持大多数领先 Web开发技术的工具中进行设计和编码 ,这些技术包括 HTML、XHTM、L CSS、XML、JavaScript 、软件和 ASP。学习最佳做法 , 参考 CSS最佳做法实现可视化设计并辅以通俗易懂的实用概念说明。在支持可访问性和最佳做法的同时创造 Ajax 驱动的交互性。集成增强, 通过跨产品线的直接通信和交互 , 充分利用 DreamweaverCS4和其它 Adobe工具的智能集成和强大功能 , 包括 AdobeFLASHCS4Professional、FIREWORKSC、S4PhotoshopCS4和 Devi

13、ceCentralCS4 软件。新增功能, 在Dreamweaver中设计页面 , 使最终用户能使用在线服务编辑他们的网页 , 无需帮助或使用其它软件。 作为 Dreamweaver设计人员, 您可以限制对2个人主页制作特定页面、特殊区域的更改权 , 甚至可以自定格式选项。 Subversion 集成新增功能在 Dreamweaver中直接更新站点和登记修改内容。 DreamweaverCS4与Subversion 软件紧密集成 , 后者是一款开放源代码版本控制系统 , 可以提供更强大的登记 / 注销体验。跨平台支持增强功能随心所欲 , 尽情工作 :DreamweaverCS4可用于基于 In

14、tel 或PowerPC的 Mac、以及系统。在首选系统中设计 , 交付跨平台、可靠、一致、高性能的成果。5.Dreamweaver 的优缺点Dreamweaver软件如图 1-1。图 1-1Dreamweaver 软件以用最快速的方式将 Firework ，Freehand，或 Photoshop 等档案移至网页上。使用检色吸管工具选择荧幕上的颜色可设定最接近的网页安全色。 对于选单，快捷键与格式控制，都只要一个简单步骤便可完成。 Dreamweaver能与您喜爱的设计工具， 如外挂模组等搭配， 不需离开 Dreamweaver便可完成， 整体运用流程自然顺畅。除此之外，只要单击便可使 Dr

15、eamweaver自动开启 Firework 或Photoshop 来进行编辑与设定图档的最佳化。控制能力 ,Dreamweaver 是唯一提供、视觉化编辑与原始码编辑同步的设计工具。它包含和 BBEdit 等主流文字编辑器。帧(frames) 和表格的制作速度快的令您无法想像。 进阶表格编辑功能使您简单的选择单格、行、栏或作未连续之选取。甚至可以排序或格式化表格群组，Dreamweaver支援精准定位， 利用可轻易转换成表格的图层以拖拉置放的方式进3个人主页制作行版面配置。所见即所得 Dreamweaver成功整合动态式出版视觉编辑及电子商务功能，提供超强的支援能力给 Third-party

16、 厂商，包含 ASP，Apache，ColdFusion ，Tango与自行发展的应用软体。当您正使用 Dreamweaver在设计动态网页时，所见即所得的功能，让您不需要透过浏览器就能预览网页。梦幻样版将内容与设计分开， 应用于快速网页更新和团队合作网页编辑。 建立网页外观的样版， 指定可编辑或不可编辑的部份， 内容提供者可直接编辑以样式为主的内容却不会不小心改变既定之样式。 您也可以使用样版正确地输入或输出 XML内容。全方位的呈现利用 Dreamweaver设计的网页， 可以全方位的呈现在任何平台的热门浏览器上。对于动态 HTML支援和鼠标换图效果，声音和动画的DHTML效果资料库可在

17、Netscape 和 Microsoft 浏览器上执行。使用不同浏览器检示功能，Dreamweaver可以告知您在不同浏览器上执行的成效如何。当有新的浏览器上市时， 只要从 Dreamweaver的网站在下载它的描述档， 便可得知详尽的成效报告。网站管理，使用网站地图可以快速制作网站雏形、设计、更新和重组网页。改变网页位置或档案名称， Dreamweaver会自动更新所有链接。使用支援文字、HTML码、HTML属性标签和一般语法的搜寻及置换功能使得复杂的网站更新变得迅速又简单。 软件特点， 效果难一致， 难以精确达到与浏览器完全一致的显示效果也就是说您在所见即所得网页编辑器中制作的网页放到浏览

18、器中是很难完全达到您真正想要的效果， 这一点在结构复杂一些的网页 （如分帧结构、 动态网页结构）中便可以体现出来。代码难控制，相比之下，非所见所得的网页编辑器，就不存在这个问题，因为所有的 HTML代码都在您的监控下产生，但是由于非所见所得编辑器的先天条件就注定了它的工作低效率。如何实现两者的完美结合，则既产生干净、准确的 HTML代码，具备所见所得的高效率、 直观性。Dreamweaver是在 网页设计与制作 领域中用户最多、 应用最广、功能最强大的软件， 随着 Dreamweaver 8 的发布，更坚定 Dreamweaver在该领域的地位。它集网页设计、网站开发和站点管理功能于一身， 具

19、有可视化、 支持多平台和跨浏览器的特性， 是目前网站设计、开发、制作的首选工具。 1 、灵活的编写方式 Dream weaver 具有灵活编写网页的特点，不但将世界一流水平的“设计”和“代码”编辑器合二为一，而且在设计窗口中还精化了 源代码 ，能帮助用户按工作需要定制自己的用户界面。2、可视化编辑界面 Dream weaver 是一种所见即所得的 HTML编辑器 ，可实现页面元素的插入和生成。 或视化编辑环境大量减少了代码的编写， 同时亦保证了其专业性和兼容性，并且可以对内部的 HTML编辑器和任何第三方的 HTML编辑器进行实时的访问。无论用户习惯手工输入 HTML源代码还是使用可视化的编辑

20、界面， Dream weaver都能提供便捷的方式使用户设计网页和管理网站变得更容易。 3 、功能更多的 CSS支持 CSS可视化设计、 CSS检查工具 4 、动态4个人主页制作跨浏览器验证 当保存时系统自动检查当前文档的跨浏览器有效性，可以指定何种浏览器为测试用浏览器， 同时系统自动检验以确定页面有没有目标浏览器不支持的 tags 或 CSS结构。动态跨浏览器有效性检查功能可以自动核对 tags 和 CSS规则是否适应目前的主浏览器。 5、强大的 WEB站点管理功能 6 、内建的图形编辑引擎 7 、Dreamweaver 的集成特性 Dream weaver 8 继承了 Fireworks

21、、Flash和 Shock wave 的集成特性，可以在这些 Web创作工具之间自由地切换，轻松地创建美观实用的网页。 8 、丰富的媒体支持能力 可以方便地加入 Java、Flash 、Shock wave、Active X 以及其他媒体。 Dream weaver 具有强大的多媒体处理功能，在设计 DHTML和CSS方面表现得极为出色，它利用 JavaScript 和 DHTML语言代码轻松地实现网页元素的动作和交互操作。 Dream weaver还提供行为和时间线两种控件来产生交互式响应和进行动画处理。 9 、超强的扩展能力 Dreamweaver 还支持第三方插件，任何人都可以根据自己的

22、需要扩展 Dreamweaver 的功能，并且可以发布这些插件。 一个网站设计得成功与否， 很大程度上决定于设计者的规划水平， 规划网站就像设计师设计大楼一样， 图纸设计好了， 才能建成一座漂亮的楼房。网站规划包含的内容很多，如网站的结构、栏目的设置、网站的风格、颜色搭配、版面布局、文字图片的运用等，你只有在制作网页之前把这些方面都考虑到了， 才能在制作时驾轻就熟， 胸有成竹。 也只有如此制作出来的网页才能有个性、有特色，具有吸引力。 Dream weaver：这是网页三剑客之一，专门制作网页的工具， 可以自动将网页生成代码， 是普通网页制作者的首选工具，界面简单， 实用功能比较强大。 设计活

23、动中包含着主观和客观两方面的因素， 在确立了网页主题之后， 首先要明确和熟悉设计的对象和构成的要素。 网页艺术设计涉及的具体内容很多， 可以概括为视听元素和版式设计两个方面。 1. 视听元素这里所说的视听元素，主要包括：文本、背景、按钮、图标、图像、表格、颜色、导航工具、 背景音乐、 动态影像等。 无论是文字、 图形、 动画， 还是音频、 视频，网页设计者所要考虑的是如何以感人的形式把它们放进页面这个“大画布”里。多媒体技术的运用大大丰富了网页艺术设计的表现力。 以上各视听元素大多数浏览器本身都可以显示或收听， 无需任何外部程序或模块支持。 比如， 大部分浏览器都可以显示 GIF、JPEG图形

24、和 GIF89a动画。 还有些多媒体文件 （如 MP3音乐）需要先下载到本地硬盘上， 然后启动相应的外部程序来播放。 另外， 在浏览器使用插件（Plug-in ）可以播放更多格式的多媒体文件。微软推出 IE 浏览器后，提供了基于 OLE的 Active X技术，用来在网页中播放多媒体。目前 Active X已经成为热门技术。另一种播放多媒体的技术是 Java Applet 。它是用 Java 语言编写的应用于网页之中的小应用程序，相比于插件和 Active X，Java Applet 具有更大的灵活性和良好的跨平台能力， 因此具有很好的发展前景。 总之，技术的不断发展使多媒体元素在网页艺术设计

25、中的综合运用越来越广泛， 使浏览者可以享5个人主页制作受到更加完美的视听效果。 这些新技术的出现， 也对网页的艺术设计提出了更高的要求。Access 数据库是集成在 Microsoft 公司开发的产品更新换代 Office 系统中的集成软件 10 。 Access 是一个数据库管理系统，它之所以被集成到Office 中而不是 Visual Studio 中，是因为它与其它的数据库管理系统（如Visual Fox Pro）相比更加简单易学， 一个普通的计算机用户即可掌握并使用它。而且最重要的一点是， Access 的功能足够强大，足以应付一般的数据管理及处理需要。 ODBC（Open Database Connectivity 开放式数据库互联）是微软推出的一种工业标准， 一种开放的独立于厂商的 API 应用程序接口， 可以跨平台访问各种个人计算机、小型机以及主机系统 11 。ODBC作为一个工业标准，绝大多数数据库厂商、大多数应用软件和工具软件厂商都为自己的产品提供了 ODBC接口或提供了 ODBC支持，这其中就包