DreamWeaver常见用法简介
合集下载
相关主题
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
Fireworks 或其它图形应用程序中建立和编辑影 像,然后将它们直接汇入到 Dreamweaver,或新 增 Macromedia Flash 对象,来简化开发工作流 程。 Dreamweaver 也提供了功能完整的程序代码 撰写环境,包括程序代码编辑工具 (如程序代码色 彩 标示和标签完成) 以及 HTML ,阶层式样式表 (CSS)JavaScript,ColdFusion 标记语言(CFML) , Microsoft Active Server Pages (ASP) 以及 Java Server Pages (JSP) 的参考数据。Macromedia Roundtrip HTML 技术不需要重新格式化程序 码, 就可以汇入您手动撰写的 HTML 文件,
制作网站模板配置网页
1 . 将网站框架页面另存为模板即可 , 即“档案”---“另存为模板” 2 . 配置可编辑区域 , 即选取特定区域 后, 按如下步骤执行即可. “插入”—“模板对象”—“可编辑区域”. 效果如下:
菜单设计架构图
图(一)
各部分详细菜单 :
综合查询 : 文件窗体查讯 , 签核状况查询 综合窗体 : ISO文件 , 窗体目录 , 窗体总览 , 共享窗体 , 标准书 申请作业 : 提出申请 牵核作业 : 签核处理 , 签核查询 法律文书 : 雁过留声 : 管理登录 :
文字 :其具体功用
1.对齐 : 指将页面中文字以一特定参考物来 对齐 2.大小 :指改变页面中选定文字的大小 3.颜色 :指改变页面中选定文字的颜色 4.字体 :指改变页面中选定文字的字体 5.样式 :指改变页面中选定文字的样式 6. ……
窗口 : 其具体功用
1.插入 : 用来显示插入特定标记 2.属性 : 用来显示属性面板 3.CSS样式 : 用来显示CSS属性面板 4.图层 : 用来显示图层属性面板 5.行为 : 用来显示行为属性面板 6.组件 : 用来显示组件属性面板 7.资源 : 用来显示资源属性面板 8. ……
十四、模板的运用
1〃准备模板 2〃定义区域 3〃应用模板
各项功能介绍
1 .整体主菜单简介:
档案:其具体功用
1.开启新档 : 用来建立一个新的设计版面 2.开启旧档 : 用来打开已经存在的页面 3.存储 : 用来保存正在编辑或已经编辑完成 的页面 4.另存新檔 : 见将正开启的页面保存为其它 新的页面 5. ……
DreamWeaver 制作基础
一、创建网页 启动Dreamweaver MX,就会自动生成一个 白色背景的文件工作区,这里就是设计和制作 网页的地方,在这里可以根据不同喜好来选择 程序源代码编辑方式或页面编辑方式 , 在页面 编辑方式中 , 可以直接输入网页设计过程中所 需要的文字、图片、表格、Flash动画等。 网页的背景颜色的,以及文字的颜色都是 可以通过“页面属性”来设置的。
十二、框架的应用
创建普通框架集 利用框架属性面板来设置该框架是否要 边线以及边线的颜色、边线宽度、框架的 名称和框架中所要显示的源文件。 可以查看框架集的文件的源代码,这里 面只保存了框架信息和它所对应的源文件。
十三、行为面板的使用
通过行为面板可以在网页上制作出一些 简单的交互效果。行为由两个部分组成, 即事件和动作,通过事件的响应执行对应 的动作。 事件是用于指明执行某项动作的条件, 动作实际上是一段执行特定任务的预先写 好的JavaScript代码,如打开窗口、播放声 音等都是动作。
操作界面
DreamWeaver MX由两个部分组成,即页面 编辑器和站点管理器。 1. 页面编辑器 : 分为五个部分:菜单栏、页面编辑区、工具 栏、控制面板、状态栏。 其中 控制面板有 属性面板、对象面板、设计面板、样式面板 帮助面板等。 2 . 站点管理器 : 站点管理器窗口显示了站点地
图,和当前网站中的文件列表。一般来说,在 建设一网站前 , 应先建立好站点,再开始制作 网页,这样可以保证页面内文件链接的正确性。
十、表格的应用
1〃插入表格 2〃表格属性面板 表格属性面板中的设置项对整个表格起 作用,如果想对表中的某一行单独设置, 首先选中表的某一行,再利用单元格属性 面板进行设置。 3〃表格的选取 4〃添加表格内容 5〃单元格的合并与拆分
十一、 层的应用 层是网页中的一种容器,它可定位在页 面上的任意位置,并且其中可包含文本、 图像、表单等所有可直接用于文档的元素。 1〃创建层 2〃层的大小调整 3〃层的移动 4〃层的属性面板 5〃层控制面板 6〃层的动态效果
插入 :其具体功用
1.标签 : 用来插入特定的html语法标记.如: <b>------</b> , <I>-------</I> 2.影像 : 用来插入特定的图片 3.表格 :用来在特定位置插入一表格 4.超链接, 邮件 : 用来在特定位置插入超链 接和邮件 5. ……
修改 :其具体功用
1.页面属性 : 指修改页面的宽,高等等 2.表格 :指修改页面中表格的具体元素.如: 栏和列的数目 3.影像 :指修改页面中需要更改的图片 4.排列顺序 :指修改页面中文字和图片或其 它元素的排列顺序 5.对齐 :指页面中特定元素的对齐方式 6. ……
四、插入鼠标变换图片
该图片对象的特点是当鼠标经过该图片时,图片 内容会自动更新。实际上,它是由两幅图 片组成的,一幅为主图片,显示在页面中;一 幅为滚动图片,当鼠标经过图片所在区域时显 示。单击对象面板中的图标,或者选择【插入】 菜单的“影像对象”子菜单中的“鼠标变换影 像”命令可实现该操作。
五、创建图片热点 在插入的图片上,可以是交换式图片, 可以把图片分为若干个区域,每个区被称 为“热点”,可以为每个热点指定相关的链 接。当单击某个热点时,系统显示相关的 网页。当绘制完热区后,属性面板会显示 热区的属性。 还可以调整热点区尺寸。
菜单和弹出菜单制作过程
(一) 菜单的制作过程 1. 首先选取表格控件 , 在预定栏内填取所要制作框架的数字. 具体祥情如图(二)所示 :
(二). 弹出菜单的制作过程 1 . 在已制作好的菜单中选取特定的菜单选项, 制作为超链接, 选取该选项 , 打开 “窗口 ”---“标签检测器”---”行为”, 点 击 “+”,选取“显示弹出式选单”,具体过程如图(三)所示 :
二、文字的编辑
可以直接在网页中输入文字,可以在【Text】下 设置文字的格式,如字体、字号、颜色、粗体、 斜体,段落居左、居中及居右,添加项目符号及 编号等。此外,还可以利用HTML样式和CSS样 式表对文字进行页面的统一格式设置。 也可以通过属性面板来更改文字的大小、颜 色、字体等。
三、插入图像
接着在弹出表框中填入特定子菜单选项,如下图所示 :
来自百度文库 最终效果如下图所示 :
充实网页内容美化页面
1 . 到不同的可编辑区域填充相应的内容 2 . 根据整体效果来美化页面 3 . 建立不同的动态页面 4 . 附上相应的版权标识
最终效果图
需要注意的一些细节问题
1. 在动手做一个网站之先,需做系统需求分析,规划 网站的拓朴 结构图; 2. 在制做设计的过程中,应避免页面色彩过多,字体 太乱; 3. 当预计整个网站的页面超过30页时 , 最好套用模 板,方便以后 的维护; 4. 在制作页面的过程中,尽量避免用到“层”, 这是 为 了防止在不同的分辨率中出现页面错乱的情况; 5. 在运用图片的时候,应避免用到过大的图片, 图片 过大时应将其分割成小图片,以加快下载速度.
DreamWeaver 简介
1. DreamWeaver 概况介绍 2. 各项功能介绍 a.整体主菜单简介 b.各部分菜单简介 3. 以制作一网站为范例简介 4. 需要注意的一些细节问题
DreamWeaver 概况介绍
DreamWeaver 是 Macromedia 公司开发出的用于 设计、撰写和开发网站、网页及网络应用程序的专 业 HTML 编辑器。它集HTML程序代码编缉器,页面 编缉器等多种视觉编辑环境于一体,能够提供多种编 辑环境。Dreamweaver 中的视觉编辑功能在不撰写 任何一行程序代码的情况下就可以快速建立网页。可 以检视所有网站项目或资源,并将它们从方便使用 的面板直接拖曳到文件中,也可以在 Macromedia
6. 在设置网站的目录结构时,需要注意到几点: (1)不要使用中文名字的目录名。 (2)不要使用过长的目录名。 (3)尽量使用意义明确的目录名,尽量做到 “见名知意”。 (4)目录的层次不要太多,建议不要超过3层
编辑 : 其具体功用
1.还原 : 撤消上一步的具体动作 2.重做 : 撤消还原的动作 3.剪下 :剪下选定的内容 4.贴上 :贴上剪下选定的内容 5.复制 :复制剪下选定的内容 6.清除 :清除选定的内容 7. ……
检视 :其具体功用
1.程序代码 : 在编辑页面显示出来是html语 言和其它源程序 2.设计 :在编辑页面显示出设计直观效果 3.程序代码和设计 : 上述二者兼有 4.表格模式 : 用来设计的三种样式 5.尺归 ,网格线 : 在编辑文档时的辅助标尺 6. ……
新建网站站点
对于DreamWeaver MX可按照如下步骤建立 网站: (1)选择菜单中的“网站”—“管理网站”--“新增”,就会弹出“网站”的对话框; (2)选择“网站”—“管理网站”---“新增”--“网站”,会弹出“定义站点”窗口,输入站点 名称和站点位置,其它选择默认值,就可以了。
搭建整个网站的框架
建设网站大概步骤
1. 对网站整体进行需求分析 1. 规划整个网站的布局 2. 搭建整个网站的框架 3. 制作整个网站的模板,配置网页 4. 撰写程序代码,填充整个网站的可编辑区 域 5. 建立动态网页 6. 附上必要的版权标识 7. 对整个网站进行测试,修改 8. 网站的上传
规划整个网站
根据网站的整体功用进行需求分析, 得 出需要将网站分成六大模块, 然后对整个网 站架构进行构思, 设计出六大相关菜单选项 和有关模块 , 然后进行相关草图设计与制 作及对相关模块进行程序开发.
然后您可以使用偏好的格式样式来重新格式化程 式码。 Dreamweaver 也能使用如 CFML、ASP.NET、 ASP、JSP 和 PHP 等服务器技术,建立动态支持 数据库的网络应用程序。 Dreamweaver 可以完全自订。您可以根据个 人喜好建立自己的对象和命令, 修改快速键,甚至 撰写JavaScript用新的行为, 属性检测器和网站报 告来扩充 Dreamweaver 功能。
六、插入水平线 在对象面板中选择按钮,在页面中点击,画 面会自动生成一条水平线,在水平线上单击, 可 以设置水平线的宽度、高度、对齐方式、是否 有阴影等参数。 七、插入邮件链接 创建邮件链接的作用是当浏览者点击该链接 时,系统将自动启动计算机中的邮件发送程序。
八、插入日期 在对象面板中选择按钮,在页面中点击, 会弹出对话框,可以设置日期格式、星期 格式、时间格式,点击“OK”,就会在页面 中自动加上时间。 九、插入Flash对象 1〃插入Flash影片 2〃 3〃
在网页中插入一幅图片时,图片文件必 须位于当前站点中。 在对象面板中选择插入图片图标或者通过菜 单中的“插入”---“图片”,此时系统将打 开“选择图像源文件”对话框。找到需要插 入的图片文件,选择“Select”,确定。 Dreamwaver支持常用的网页图片格式有 扩展名为“GIF”、“JPG”、“JPEG”、 “PNG” 的图形文件。