实训3简单的页面操作.doc

《实训3简单的页面操作.doc》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、个人收集整理勿做商业用途3实训三简单的页面操作实训目的和要求一、实训目的1．进一步熟悉DreamweaverMX2004工作环境。2．掌握简单的页面操作。二、实训要求1．掌握网页的新建、打开、保存等操作方法.2．了解操作HTML源文件的三种方法。3．学会导入Word文件。三、时间分配2课时四、环境要求DreamweaverMX2004五、内容提要1．建立一个本地站点.2．建立并导入一个Word文档。3．分别用三种方法编辑简单的HTML源代码。4．预览网页。六、教学重点与难点:1．建立并导入一个Word文档.2．分别用三种方法编辑简单的

2、HTML源代码。实训内容与步骤一、准备工作在C盘或其他盘新建一个文件夹,作为站点文件夹。输入你想要的站点名称,这里输入myweb3。在此文件夹中新建一个Word文档，文件名为“wj1。doc”,内容如图3。1。个人收集整理勿做商业用途图3。1Word文件内容二、建立本地站点用已学方法建立本地站点。三、导入Word文件1．在默认打开的新网页中，选择【文件】

3、【导入】中的“Word文档”命令，将开始建立的Word文档“wj1.doc”导入到网页中.2．选择【命令】

4、【清理Word生成的HTML】命令，对导入的内容进行特殊的缩减处理,以清除

5、其中的冗余代码。三、使用三种方法编辑HTML源代码编辑后的预览效果如图3.2所示。图3。2修改HTML源代码的预览效果个人收集整理勿做商业用途用方法一修改第一行文字效果。将光标定位在第一行文字的开始部分,然后单击文档工具栏中【代码】按钮或【拆分】按钮，以显示出网页源代码部分.在〈P>后面添加定义文字大小的标签“〈fontsize=”+6”〉〈/font〉”并将被定义内容“天津电子信息职业技术学院”环绕住。如图3。3所示。图3.3定义第一行文字大小的代码及位置用方法二修改第二行文字效果。单击【窗口】｜【代码检查器】(按快捷键F10），切

6、换到【代码检查器】面板，然后将光标定位在第二行开始处,输入定义文字为斜体的HTML标签“〈I>”，并将被定义文字环绕，如图3。4所示。图3。4【代码检查器】窗口中定义第二行文字为斜体的代码及位置个人收集整理勿做商业用途用方法三修改第三行文字效果。先选中第三行文本,然后选择【修改】

7、【快速标签编辑器】命令(或按下Ctrl+T快捷键），打开HTML快速标签编辑器,通过按下Ctrl+T将快速标签编辑器切换成“编辑标签”模式，按图3。5所示编辑文字为居中对齐的标签。图3。5【快速标签编辑器】窗口及第三行文字居中对齐的标签用上述三种方法

8、中的任意一种完成后续内容的编辑修改。其中：第四行的标签代码为“〈b〉天津电子信息职业技术学院〈/b>”；第五行的标签代码为“天津电子信息职业技术学院"；第六行的标签代码为“天津电子信息职业技术学院〈/h3〉”。四、保存网页选择【文件】

9、【保存】命令，将此网页保存在站点中。五、站点测试按F12键在浏览器中预览，观察效果与样图是否一致。