Dreamweaver8入门教程

1基础知识基础知识基础知识基础知识————————网页设计简介网页设计简介网页设计简介网页设计简介0.1　网页设计概述0.2　初识Dreamweaver820.10.10.10.1　网页设计概述　网页设计概述　网页设计概述　网页设计概述0.1.1　网页设计遵循的理念0.1.2　网站整体风格的确定0.1.3　网页创意0.1.4　网页色彩搭配简介0.1.5　常用网页设计工具简介30.1.10.1.10.1.10.1.1　网页设计遵循的理念　网页设计遵循的理念　网页设计遵循的理念　网页设计遵循的理念（1）考虑访问者的带宽问题。（2）版面布局合理。（3）网站标志的设计。（4）站点内容要精、专，及时更新。40.1.20.1.20.1.20.1.2　网站整体风格的确定　网站整体风格的确定　网站整体风格的确定　网站整体风格的确定•网站的风格–指网站的整体形象给访问者的综合感受。•包含的因素–网站的标志设计、色彩、版面布局、浏览方式、交互性、文字和价值等。•例如：–儿童网站“WaWaYaYa”是生动活泼的；大多商业网站如IBM，是专业严肃的。5://://://确定网站的整体风格需要注意以下几个方面：确定网站的整体风格需要注意以下几个方面：确定网站的整体风格需要注意以下几个方面：确定网站的整体风格需要注意以下几个方面：（1）网站标志要放在醒目位置要保持不变。（2）反应网站精髓的标语并动态显示。（3）导航放在每一张网页的相同位置。（4）确定网站的主体颜色并注意颜色。（5）页面的布局一般采用左边导航右边文字，或者上面导航下面文字的方法，或两者结合使用。（6）内容结构简单且分类要简而精。80000.1.3.1.3.1.3.1.3　网页创意　网页创意　网页创意　网页创意•什么是创意？–（1）创意是传达信息的一种特殊手段。–（2）创意是将现有的要素重新组合。90000.1.4.1.4.1.4.1.4　网页色彩搭配简介　网页色彩搭配简介　网页色彩搭配简介　网页色彩搭配简介•网页色彩搭配应考虑以下因素：–（1）色彩的鲜明性。–（2）色彩的独特性。–（3）色度的合适性。–（4）色彩的代表性。100000.1.5.1.5.1.5.1.5　常用网页设计工具简介　常用网页设计工具简介　常用网页设计工具简介　常用网页设计工具简介1．网页设计软件Dreamweaver2．网络动画制作软件Flash3．网络图像处理软件Fireworks（本课程主讲Photoshop）第第第第1111讲讲讲讲Dreamweaver8.0Dreamweaver8.0Dreamweaver8.0Dreamweaver8.0界面及界面及界面及界面及站点建设站点建设站点建设站点建设12第第第第1111讲讲讲讲Dreamweaver8.0Dreamweaver8.0Dreamweaver8.0Dreamweaver8.0界面及站界面及站界面及站界面及站点建设点建设点建设点建设•1.1Dreamweaver8.0简介•1.2创建站点•1.3网页文件的基本操作•1.4设置页面属性•1.5练习制作简单的网页站点131.1Dreamweaver8.01.1Dreamweaver8.01.1Dreamweaver8.01.1Dreamweaver8.0简介简介简介简介•1.1.1Dreamweaver8.01.1.1Dreamweaver8.01.1.1Dreamweaver8.01.1.1Dreamweaver8.0的启动和退出的启动和退出的启动和退出的启动和退出•1.1.2Dreamweaver8.01.1.2Dreamweaver8.01.1.2Dreamweaver8.01.1.2Dreamweaver8.0的工作环境的工作环境的工作环境的工作环境141.1.1Dreamweaver8.01.1.1Dreamweaver8.01.1.1Dreamweaver8.01.1.1Dreamweaver8.0的启动和退的启动和退的启动和退的启动和退出出出出1.1.1.1.启动启动启动启动Dreamweaver8.0Dreamweaver8.0Dreamweaver8.0Dreamweaver8.0在Windows操作系统下，单击左下角的【开始】按钮，从【程序】菜单中选择Macromedia菜单，然后从子菜单中单击【MacromediaDreamweaver8】即可启动，如图所示。152.2.2.2.退出退出退出退出Dreamweaver8.0Dreamweaver8.0Dreamweaver8.0Dreamweaver8.0退出Dreamweaver8.0的方法很简单，我们可以有以下几种方式退出编辑界面：（1）单击Dreamweaver8窗口右上方的关闭按钮；（2）按下“Alt+F4”组合键；（3）选择“文件”菜单中的“退出”命令，或按快捷键Ctrl+Q退出系统。161.1.2Dreamweaver8.01.1.2Dreamweaver8.01.1.2Dreamweaver8.01.1.2Dreamweaver8.0的工作环境的工作环境的工作环境的工作环境•Dreamweaver8.0的操作窗口171.21.21.21.2创建站点创建站点创建站点创建站点•1.2.11.2.11.2.11.2.1创建本地站点创建本地站点创建本地站点创建本地站点•1.2.21.2.21.2.21.2.2管理站点管理站点管理站点管理站点•1.2.31.2.31.2.31.2.3管理网站中的文件和文件夹管理网站中的文件和文件夹管理网站中的文件和文件夹管理网站中的文件和文件夹181.2.11.2.11.2.11.2.1创建本地站点创建本地站点创建本地站点创建本地站点•步骤步骤步骤步骤1111：在本地硬盘上建立一个用来存放站点的文件夹，：在本地硬盘上建立一个用来存放站点的文件夹，：在本地硬盘上建立一个用来存放站点的文件夹，：在本地硬盘上建立一个用来存放站点的文件夹，命名为命名为命名为命名为““““sitesitesitesite””””，该文件夹就是本地站点的根目录，是为网，该文件夹就是本地站点的根目录，是为网，该文件夹就是本地站点的根目录，是为网，该文件夹就是本地站点的根目录，是为网站特别建立的一个文件夹。站特别建立的一个文件夹。站特别建立的一个文件夹。站特别建立的一个文件夹。•步骤步骤步骤步骤2:2:2:2:打开打开打开打开Dreamweaver8.0Dreamweaver8.0Dreamweaver8.0Dreamweaver8.0，选择，选择，选择，选择““““站点站点站点站点””””菜单下的菜单下的菜单下的菜单下的““““管管管管理站点理站点理站点理站点””””命令，或者选择文件面板中的命令，或者选择文件面板中的命令，或者选择文件面板中的命令，或者选择文件面板中的““““管理站点管理站点管理站点管理站点””””命令，命令，命令，命令，打开打开打开打开““““管理站点管理站点管理站点管理站点””””对话框。对话框。对话框。对话框。19•步骤3:单击“管理站点”对话框中的“新建”按钮，在弹出菜单中选择“站点”命令。20•步骤4：单击“站点”命令后，系统会弹出窗口，这是一个定义站点的向导，选择“基本”选项卡，给网站定义一个名称，例如“数学与计算机系”。21•步骤5：单击“下一步”按钮，在窗口中设置网站是否使用服务器技术，例如：ASP、PHP等。由于我们要制作的是基本的静态网站，所以选择“否，我不想使用服务器技术”单选按钮。22•步骤6：单击“下一步”按钮，开始设置网页的存储方法和存储路径。在上半部分的单选项中选择第一项“编辑我的计算机上的本地副本，完成后再上传到服务器（推荐）”。如果申请的网站空间支持在线编辑功能，那么可以选择“使用本地网络直接在服务器上编辑”单选项。2324•步骤7：完成以上的设置后单击“下一步”按钮，在这里选择连接服务器的方式，以及网页在服务器上的存储位置。25•步骤8：单击“下一步”按钮。在这里选择是否使用“存回”和“取出”。选中“是，启用存回和取出”选项，可以多人共同完成网站的维护工作。如果只需一个就能够完成网站的维护工作，可以选择“否”。26•步骤9：至此完成了对网站的基本定义。单击“下一步”按钮，Dreamweaver8.0会弹出对话框询问设置的信息是否准确，单击“完成”按钮，本地站点就创建成功了。271.2.21.2.21.2.21.2.2管理站点管理站点管理站点管理站点1.1.1.1.切换站点切换站点切换站点切换站点Dreamweaver8.0中可以同时存在多个站点，在文件面板左边的下拉列表框中选中某个已创建的站点，就可切换到对这个站点进行操作的状态。281.2.21.2.21.2.21.2.2管理站点管理站点管理站点管理站点2222．编辑站点．编辑站点．编辑站点．编辑站点如果要对站点进行编辑，可以在“管理站点”对话框中，选择要编辑的站点，然后用鼠标单击“管理站点”对话框中的“编辑”按钮，重新打开“站点定义”向导，根据需要一步一步修改站点的属性即可。291.2.21.2.21.2.21.2.2管理站点管理站点管理站点管理站点3333．删除站点．删除站点．删除站点．删除站点如果不需要某个站点时，可以将其从站点列表中删除。选择“站点”菜单下的“管理站点”命令，打开“管理站点”对话框，在该对话框中选择一个站点，单击“删除”按钮，即可删除一个站点，对某一个站点进行删除操作后，网站的文件仍保存在硬盘原来的位置上，并没有从硬盘上删除。301.2.31.2.31.2.31.2.3管理网站中的文件和文件夹管理网站中的文件和文件夹管理网站中的文件和文件夹管理网站中的文件和文件夹1111．创建文件夹和文件．创建文件夹和文件．创建文件夹和文件．创建文件夹和文件文件面板通常显示站点中的所有文件和文件夹，但新建的站点中不包含任何文件或文件夹。所有的文件和文件夹都需要新建，在文件面板中站点根目录上单击鼠标右键，然后从弹出的快捷菜单中单击菜单项“新建文件夹”或“新建文件”，接着给新的文件夹或文件命名。311.2.31.2.31.2.31.2.3管理网站中的文件和文件夹管理网站中的文件和文件夹管理网站中的文件和文件夹管理网站中的文件和文件夹2222．重命名文件夹或文件．重命名文件夹或文件．重命名文件夹或文件．重命名文件夹或文件先选中需要重命名的文件夹或文件，然后单击右键，在弹出的快捷菜单中单击“编辑”选项的下级菜单中的“重命名”命令或者按【F2】快捷键，文件夹或文件的名称变为可编辑状态，重新输入新的名称，按Enter键确认即可。3333．移动和复制文件．移动和复制文件．移动和复制文件．移动和复制文件从“文件”面板的本地站点文件列表中，选中要移动或复制的文件夹或文件，如果要进行移动操作，在弹出的快捷菜单中单击“编辑”选项的下级菜单中的“剪切”命令；如果要进行复制操作，则执行“编辑”选项的“拷贝”命令，然后执行“编辑”选项下的“粘贴”命令，将文件夹或文件移动或复制到相应的文件夹中。4444．删除文件夹或文件．删除文件夹或文件．删除文件夹或文件．删除文件夹或文件要从本地站点文件列表中删除文件夹或文件，先选中要删除的文件夹或文件，然后执行“编辑”选项同上的“删除”命令或按Delete键，这时系统会弹出一个提示对话框，询问是否要真正删除文件夹或文件，单击“是”按钮确认后即可将文件夹或文件从本地站点中删除。321.31.31.31.3网页文件的基本操作网页文件的基本操作网页文件的基本操作网页文件的基本操作•1.3.11.3.11.3.11.3.1创建网页和打开网页创建网页和打开