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