实验一初识Dreamweaver CS6

实验一 初识Dreamweaver CS6(验证性实验2学时) 一、实验目的1掌握认识并熟悉Dreamweaver的工作界面，能够自定义工作环境。2掌握代码视图的使用方法。 二、软硬件环境1 硬件：奔腾686处理器， 2G内存，150G硬盘。2 软件：中文Windows XP的操作系统和Adobe Dreamweaver CS 6应用程序。三、预习要求认真复习课堂所讲内容。应了解和掌握网页的基本概念及网页的基本构成元素；学会站点整体规划；熟练代码视图的使用方法。四、实验内容1建立本地站点1) 在D盘根目录下建立一个名为web的文件夹。在web文件夹下，建立一个名为images的子文件夹（用于存放网站的图片文件），将素材中的图片复制到images文件夹中。2) 定义一个本地站点，其中站点名为：我的站点，站点的根目录为web，默认图像文件夹为images。操作步骤：(1) 启动Adobe Dreamweaver CS6 ，单击“站点”“新建站点” 选择“站点”选项卡，设置站点名称和站点文件夹。(2) 选择“高级设置”中的“本地信息”选项卡，设置默认图像文件夹。(3) 点击“保存”按钮。3) 管理本站点。操作步骤：“站点”“管理站点”：删除站点 ：编辑站点：复制站点 ：导出站点2新建一个文件1_1.html，分别设置该文件的页面属性、下载时间与大小，并预览该页面。提示： “文件”“新建”打开新建文档对话框，如下图所示。 在代码视图中输入：新浪网，然后转换到设计视图，并保存文件为1_1.html。1) 页面属性设置 包括外观（CSS）设置（默认字体、字号、字色、背景色、背景图片及边距）、链接（CSS）、标题/编码设置。操作步骤：“修改”“页面属性”打开页面属性对话框。u 选择“外观（CSS）”选项卡，按照下图所示设置文本的大小、颜色和网页的背景色。单击“应用”按钮查看设置效果。u 选择“外观（CSS）”选项卡，将网页的背景图像设置为“images/2.gif”。单击“应用”按钮查看设置效果。u 选择“标题/编码”选项卡，将网页的标题设置为“我的第一个网页”。u 选择“链接（CSS）”选项卡，按下图所示设置网页的链接2) 下载时间与大小 网页文件的设计要遵循8秒钟原则。操作步骤如下：(1) 设置链接速度。“编辑”“首选参数”“窗口大小”，如下图所示设置链接速度。(2) 在状态栏查看下载时间与网页文件的大小。，其中的6K为文件的大小，1秒为网页打开所需时间。3) 预览网页文件 u 设置默认浏览器。“编辑”“首选参数”“在浏览器中预览”，如下图所示，可以添加浏览器、设置主浏览器、预览网页文件的快捷键。u 预览网页文件。单击文档工具栏中的按钮。如下图所示。3新建一文件1_2.html，将Excel工作薄“学生成绩.xlsx”【导入】其中，并设置网页标题为“学生成绩”。操作步骤如下：1) 新建一个Excel文档“学生成绩.xlsx”，工作表的内容如下：2) 新建一文档1_2.html，单击“文件” “导入” “Excel文档（E）”，导入刚刚创建的“学生成绩.xlsx”。效果图如下：3) 保存并预览网页设计效果。4代码视图的使用1) 新建一文档1_3.html，在代码视图中输入如下的代码：这是我的第三个网页。 新浪网 姓名 数学英语张三8270效果图如下：2) 新建一文档1_4.html，从网上搜索一网页特效代码，复制到代码窗口中，并查看效果。操作步骤如下：(1) 通过搜索引擎（如百度）搜索“特效代码”网站；特效网站：/(2) 查找所需要的特效，运行代码查看特效效果；(3) 复制需要的特效代码；(4) 切换到“代码视图”；(5) 定位插入点并粘贴特效代码；(6) 预览效果鼠标跟随时