PHP+MySQL+Dreamweaver动态网站开发实例教程 教学课件 ppt 作者 刘瑞新 电子课件和案例素材 第1章 Dreamweaver的基本操作

上传人:E**** 文档编号:89180613 上传时间:2019-05-20 格式:PPT 页数:16 大小:663KB
返回 下载 相关 举报
PHP+MySQL+Dreamweaver动态网站开发实例教程 教学课件 ppt 作者 刘瑞新 电子课件和案例素材 第1章  Dreamweaver的基本操作_第1页
第1页 / 共16页
PHP+MySQL+Dreamweaver动态网站开发实例教程 教学课件 ppt 作者 刘瑞新 电子课件和案例素材 第1章  Dreamweaver的基本操作_第2页
第2页 / 共16页
PHP+MySQL+Dreamweaver动态网站开发实例教程 教学课件 ppt 作者 刘瑞新 电子课件和案例素材 第1章  Dreamweaver的基本操作_第3页
第3页 / 共16页
PHP+MySQL+Dreamweaver动态网站开发实例教程 教学课件 ppt 作者 刘瑞新 电子课件和案例素材 第1章  Dreamweaver的基本操作_第4页
第4页 / 共16页
PHP+MySQL+Dreamweaver动态网站开发实例教程 教学课件 ppt 作者 刘瑞新 电子课件和案例素材 第1章  Dreamweaver的基本操作_第5页
第5页 / 共16页
点击查看更多>>
资源描述

《PHP+MySQL+Dreamweaver动态网站开发实例教程 教学课件 ppt 作者 刘瑞新 电子课件和案例素材 第1章 Dreamweaver的基本操作》由会员分享,可在线阅读,更多相关《PHP+MySQL+Dreamweaver动态网站开发实例教程 教学课件 ppt 作者 刘瑞新 电子课件和案例素材 第1章 Dreamweaver的基本操作(16页珍藏版)》请在金锄头文库上搜索。

1、PHP+MySQL+Dreamweaver 动态网站开发案例教程,机械工业出版社同名教材 配套电子教案,一 Dreamweaver概述 二 Dreamweaver的工作环境 三 Dreamweaver创建网页的工作流程 四 站点管理 五 实训,第1章 Dreamweaver的基本操作,Dreamweaver是Adobe公司开发的著名网站开发工具,利用Dreamweaver的可视化编辑功能,用户可以轻松地完成设计、开发和维护网站的全过程。Dreamweaver不仅提供了直观的可视布局界面,而且具备强大的编码工具。用户可以使用服务器语言(例如,ASP、ASP.NET、ColdFusion标记语言、

2、JSP和PHP)生成支持动态数据库的Web应用程序,使用Ajax的Spry框架进行动态用户界面的可视化设计、开发和部署。 使用Dreamweaver的网站地图,用户可以快速地制作网站雏形。在设计过程中,用户如果改变了网页的位置,Dreamweaver会自动更新所有链接。Dreamweaver提供一组预先设计的CSS布局,可以帮助用户快速地设计出美观的页面。Dreamweaver成功地整合了所见即所得的编辑方式和动态网站开发功能。,1.1 Dreamweaver概述,1.2.1 Dreamweaver的启动 安装好Dreamweaver后,选择“开始”“程序”“Adobe Dreamweaver

3、 CS3”命令。Dreamweaver经过一系列初始化过程后,首先显示“工作区设置”对话框,如图1-1所示。由于要采用可视化方式设计网页,选中“设计者”单选钮,单击“确定”按钮。 接下来显示起始页对话框,如图1-2所示,在其中可以在“打开最近的项目”、“新建”或“从模板创建”栏中进行选择。,1.2 Dreamweaver的工作环境,1.2.2 Dreamweaver的主工作区 Dreamweaver的主工作区由插入工具栏、文档工具栏、文档窗口、属性面板等部分组成,如图1-3所示。,1.2 Dreamweaver的工作环境,Dreamweaver为处理各种Web设计和开发文档提供了灵活的环境。除

4、了HTML文档以外,用户还可以创建和打开各种基于文本的文档,如ASP、JavaScript和CSS。Dreamweaver还支持源代码文件,如PHP、C#和Java。 Dreamweaver为创建新文档提供了若干选项,用户可以创建以下任意文档: 新的空白文档或模板; 基于Dreamweaver附带的预设计页面布局文档; 基于现有模板的文档。,1.3 Dreamweaver创建网页的工作流程,1创建新文档 用户可以用下列方法创建新文档。 创建新的空白文档 创建新的空白文档,操作步骤如下。 选择“文件”“新建”,即出现“新建文档”对话框,默认选中“空白页”选项。 从“页面类型”列表框中选择类型,对

5、于基本页,可选择“HTML”;如果有页面布局的需要,可以从右侧的“布局”列表框中选择需要的布局。 单击“创建”按钮,在文档窗口中创建新文档。,1.3 Dreamweaver创建网页的工作流程,2保存新文档 要保存新文档,操作步骤如下。 选择“文件”“保存”。 在出现的对话框中,定位到要用来保存文件的文件夹。 在“文件名称”文本框中,输入文件名。不要在文件名和文件夹名中使用空格和特殊字符,文件名也不要以数字开头。例如,为新建的网页命名为“example.html”。 单击“保存”按钮。,1.3 Dreamweaver创建网页的工作流程,1.4.1 Dreamweaver的网站定义 严格地说,站点

6、也是一种文档的磁盘组织形式,它同样是由文档和文档所在的文件夹组成的。设计良好的网站通常具有科学的结构,利用不同的文件夹,将不同的网页内容分门别类地保存,这是设计网站的必要前提。结构良好的网站,不仅便于管理,也便于更新。 利用Dreamweaver可以对位于Internet服务器上的站点文档直接进行编辑和管理,但有时非常不便,且影响的因素很多,例如,网络速度和网络的不稳定性等都会对管理和编辑操作带来影响。另一个更重要的原因是,如果直接对位于Internet服务器中的文档和站点进行操作,则必须始终保持同Internet的连接,这意味着会花费不必要的上网费用。,1.4 站点管理,1.4.2 建立本地

7、站点 【案例1-1】建立一个本地站点,定义站点名称和站点使用的本地根文件夹及默认的图像文件夹。 【案例展示】站点的设置如图1-17所示,站点结构如图1-18所示。,1.4 站点管理,1.4.3 管理本地站点 1编辑站点 在Dreamweaver中创建好本地站点后,如果需要,还可以对整个站点进行编辑操作。例如,编辑修改站点、复制站点、删除站点等。编辑站点的操作步骤如下。 选择“站点”“管理站点”,打开“管理站点”对话框。 在“管理站点”对话框左侧列表框中选择需要编辑的站点,然后单击右侧按钮,则可以进行相应的操作。,1.4 站点管理,1.4.3 管理本地站点 2文件的基本操作 在Dreamweav

8、er中,可以使用“文件”菜单对单独的文件进行管理,例如,执行“新建”、“打开”、“保存”、“另存为”等命令。另外,也可以在“文件”面板中,在文件或文件夹上单击鼠标右键,在弹出快捷菜单的“编辑”命令子菜单中,执行“新建”、“打开”、“删除”、“移动”、“复制”、“重命名”等命令对网站中的文件进行管理。 3指定站点首页 首页就是网站的门面。通常,首页文件中包含有若干指向其他主要网页的超链接。可以先为网站创建一个空白首页,然后进行编辑,并可以利用站点地图查看网站中超链接的情况。,1.4 站点管理,1.4.4 站点的测试 当用户获得了域名和网站空间之后,应当对本地站点进行完整的测试,再将页面上传到远程

9、Web服务器中,主要的测试工作包括: (1)确保页面在浏览器中的显示达到预期效果 (2)在不同的浏览器上预览页面。 (3)检查站点是否有断开的链接 (4)运行站点报告来测试并解决整个站点的问题,1.4 站点管理,1.4.5 站点的发布 网页设计好并在本地站点测试通过后,必须把它发布到Internet上形成真正的网站,否则网站形象仍然不能展现出去。要构建远程站点,必须知道ISP提供的主页空间是如何支持上传的。网页的上传一般是通过FTP软件工具连接Internet服务器进行上传的。FTP软件很多,如CutFtp、LeapFtp等,也可以使用Dreamweaver的站点管理器上传网页。 Dreamw

10、eaver内置了FTP上传功能,可以通过FTP实现在本地站点和远程站点之间的文件传输。,1.4 站点管理,【实训综述】建立一个旅游主题的本地站点及制作网站首页。 【实训展示】本实例页面预览后的结果如图1-37所示。,1.5 实训,图1-37 页面预览的结果,1简答Dreamweaver文档编辑所包括的3种视图及特点。 2在本地站点中创建一个首页文件index.html和一个存放图像的文件夹images,自定义首页文件的标题、背景色和页面字体。 3举例简述Dreamweaver创建网页的工作流程。 4本地站点和远端站点的区别是什么?举例建立一个本地站点。 5测试网页主要包括哪些方面的测试? 6简述使用Dreamweaver发布网站的过程。,1.6 习题,

展开阅读全文
相关资源
相关搜索

当前位置:首页 > 高等教育 > 大学课件

电脑版 |金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号