个人知识管理[36P][112MB]

网页设计与制作应用教程机械工业出版社同名教材配套电子课件2009.4第3章AdobeDreamweaveCS3入门知识3.1Dreamweave概述3.2AdobeDreamweaveCS3工作环境3.3站点的建立3.4站点文件的基本操作3.5边学边做3.1Dreamweave概述Dreamweave特点Dreamweave是一款专业的HTML编辑器，它的功能特点如下：可视化编辑功能高效的站点管理全面的编码环境支持服务器功能扩展功能3.2AdobeDreamweaveCS3工作环境工作区布局选择3.2AdobeDreamweaveCS3工作环境“设计器”工作区布局3.2AdobeDreamweaveCS3工作环境Dreamweaver的工作区组成:文档窗口“插入”栏文档工具栏面板组标签选择器“属性”面板“文件”面板3.2AdobeDreamweaveCS3工作环境“插入”栏文档工具栏A.显示代码视图B.显示代码视图和设计视图C.显示设计视图D.文档标题E.文件管理F.在浏览器中预览/调试G.刷新设计视图H.视图选项I.可视化助理J.验证标记K.检查浏览器兼容性3.2AdobeDreamweaveCS3工作环境状态栏属性面板3.2AdobeDreamweaveCS3工作环境“文件”面板3.2AdobeDreamweaveCS3工作环境菜单功能文件菜单编辑菜单视图菜单插入菜单站点菜单窗口菜单帮助菜单快捷菜单3.2AdobeDreamweaveCS3工作环境自定义DreamweavrCS3工作区1、显示和隐蔽面板3.2AdobeDreamweaveCS3工作环境2、设置Dreamweaver的首选参数3.2AdobeDreamweaveCS3工作环境显示和隐藏欢迎屏幕3.3站点的建立建立站点的目的就是为了有效的组织管理设计网页所需要的各种元素。站点需要一个名称和存储位置也就是目录，它可以是存储磁盘的任何位置。站点有网络服务器中的站点（即远程站点）和本地站点两种创建形式。3.3站点的建立选择主菜单【站点】/【新建站点】命令，在文本框内输入站点的名称，单击“确定”按钮3.3站点的建立如果要使用服务器技术（如：ASP等），可单击选择第二个单选项，否则默认选择第一个单选项。单击“下一步”。3.3站点的建立选择在本地编辑还是在服务器编辑。并在文本框中指定站点文件夹的位置。单击“下一步”。3.3站点的建立选择如何连接到服务器。选择是否启用存回和取出模式。3.3站点的建立总结新创建的站点的所有设置信息，确认后单击“完成”按钮。“文件”面板会显示出新创建的站点文件夹。3.3站点的建立创建站点目录和文件操作方法可以是：在“文件”面扳中右键击“我的网站”站点，在弹出的快捷菜单中执行“新建文件（或新建文件夹）”命令。在出现文本框中重命名文件名（或文件夹名称），这样就方便地达到了有序管理所有站点资源的目的3.3站点的建立修改站点信息选择主菜单【站点】/【管理站点】目录，弹出“管理站点”对话框，如图所示。单击需要修改的站点名称，再单击“编辑”按钮，即可再次弹出“站点定义”对话框，然后重新进行站点设置。3.3站点的建立站点视图单击“文件”面板中的“展开/折叠”按钮（），将站点文件窗口展开为最大化。对窗口可以调整查看区域的大小，并利用该窗口更改站点视图方式。如图所示的是分别以“站点文件”视图方式和“站点地图和文件”视图方式查看站点信息。3.4站点文件的基本操作创建和打开文档1、新建文档2、打开文档3、保存文档3.4站点文件的基本操作管理文件和文件夹文件”面板功能十分重要，它可以用于：访问站点、服务器和本地驱动器、查看文件和文件夹、管理文件和文件夹，以及使用站点的可视化地图等工作。在“文件”面板中，可以及时处理站点文件和文件夹，如：打开文件、更改文件名；添加、移动或删除文件；在进行更改后刷新“文件”面板。对于Dreamweaver站点，还可以确定哪些文件（本地站点或远程站点上）在上次传输后进行了更新。在“文件”面板中，选择一个文件或文件夹。右键单击，在弹出的快捷菜单中选择“新建文件”或“新建文件夹”选项；输入新文件或新文件夹的名称，按“Enter”键即可创建新的文件（文件夹）。3.4站点文件的基本操作3.5边学边做（用DreamweaverCS3打开并浏览网页）从“开始”按钮的弹出菜单中选择AdobeDreamweaverCS3，启动软件。单击“欢迎”屏幕中“打开最近的项目”底部的“打开”按钮。在“打开”对话框中选择“index1.html”文档，并确认打开，如图所示，此时窗口默认以“设计视图”方式显示文档编辑内容。3.5边学边做（用DreamweaverCS3打开并浏览网页）3.5边学边做（用DreamweaverCS3打开并浏览网页）在Dreamweaver中，单击“文档”工具栏中“代码视图”按钮，窗口显示如图所示。3.5边学边做（用DreamweaverCS3打开并浏览网页）单击“拆分视图”按钮，窗口显示如图所示。3.5边学边做（用DreamweaverCS3打开并浏览网页）单击“文档”工具栏中预览按钮，如图所示，在浏览器窗口中获得网页效果。也可以按F12浏览网页。3.5边学边做（用DreamweaverCS3打开并浏览网页）思考与练习1.描述改变面板的大小、位置的操作方法。2.简述属性面板的作用。3.描述文件打开、存储的操作过程。4.创建站点的基本步骤是什么？5.简述站点视图的几种查看方式？6.创建一个个人主页站点。