Dreamweaver简明手册——常用功能介绍

1.概述

Dreamweaver 是一款集网页制作和管理网站于一身的所见即所得网页编辑器，在开发前端视图页面的时候，用这个工具，能让代码更清晰化，界面更整洁，可以大大的提升Web前端开发效率。
基于数通畅联的AEAI DP开发平台可以直接生成JSP前端页面，通常在AEAI DP中使用JSP编辑器编辑JSP页面，但是JSP编辑器强于在JSP页面上写JAVA代码片段，但调整页面里的表单元素以及CSS样式等不方便，因此，一般采用AEAI D跟Dreamweaver配合进行前端JSP页面扩展开发。本文对Dreamweaver的常见用法进行说明，为相关技术人员提供参考。

2.预计读者

1. 数通畅联软件新进技术人员

2. 数通畅联合作伙伴的技术人员

3. 外部IT从业者

3.介质安装

3.1安装及下载

下载地址如下：http://pan.baidu.com/s/1c0vqeK4#path=%252F%25E5%2589%258D%25E7%25AB%25AF%25E5%25BC%2580%25E5%258F%2591%25E5%25B7%25A5%25E5%2585%25B7%252FDreamweaver
解压到指定文件夹，点击安装

3.2主界面预览

4.使用说明

4.1创建站点

Deramweaver站点是网站中使用的所有文件的资源的集合。Dreamweaver站点通常包含两个部分：可在其中存储和处理文件的计算机上的本地文件夹，以及可在其中将相同文件发布到Web上的服务器上的远程文件夹。我们在开发及调试过程中主要使用本地文件夹站点，下面会详细介绍。
在菜单站点à新建站点后，填入弹出的对话框中需要的信息，如下
站点名称：任意，例如aeaihr。
本地站点文件：一般直接选择开发平台生成的工程的WebRoot目录



保存后，如下图，这样可以方便我们直接查找和修改文件，双击JSP、CSS、JS文件都可以直接在主界面上打开。

4.2插入功能

插入功能可以直接在页面上插入一些页面元素



通过点击菜单—》窗口---》插入，如下图。一般同时选中“属性”项。



以下对插入面板里面的各类功能进行介绍：

4.1.1常用

4.1.1.1超链接

点击超链接功能直接点入设计页面里，出现下图，只要在文本里添加上超链接标签名称（任意起）:



点击确定后，如下图，


代码部门 body元素里有了a标签，然后在设计页面里有了连接。然后在页面下方找到 按钮，然后点击按住指向站点管理的某个页面文件。



释放按键后再来看代码部门的变化



然后到浏览器页面上超链接可跳转到上方的连接路径里。

4.1.1.2电子邮件链接

电子邮件链接也是超链接，这是跳转到电子邮件里，而不是其他的页面。
点击电子邮件链接功能，出现信息框，文本是名称（随意起），电子邮件里填上要发送目标的电子邮箱地址。



       点击确定以后，如下图。


 
保存后，切换到页面测试



点击dw连接后将跳转发送邮件功能，如下图。

4.1.1.3命名锚记

锚点链接，此类链接跳转至文档内的特定位置。
首先要定位找到需要跳转的位置，如图所示：


将光标留在箭头处，然后点击锚链接 按钮，弹出命名框体，如下图。


我将名称命名为dw，确定后，#15前会出现个锚标记 。



下一步，我们设计界面拉到上面将光标#1上，然后我们观察工具下方的属性。将连接名字改为#+锚点命。



然后，进入网页测试，首先在网页顶部，然后点击#1直接跳入#15位置。