如何用记事本建立简单的网页[1][修改版]

如何用记事本建立简单的网页[1][修改版] 第九章 网页制作 实验一 用记事本建立简单的HTML文件 【实验目的】 学会用HTML语言建立一个简单的网页。 【实验内容】 建立一个网页，布局自定，包括自我介绍、图片、自己的电子信箱地址等，要求在标与正文之间插入一条水平线。(实验中所用到的图片、音乐等素材均可在计算中心配备的计算机中找到，具体路径为C:\DATA) 【实验步骤】 1、 启动“记事本”和“IE浏览器”，并纵向平铺两窗口; 2、 在“记事本”窗口输入下面的代码: 3、 保存该文件到D:\myweb文件夹中，取名为“yoyo.htm”;(注意，文件的扩展名一定 为.htm或html;如果没有myweb文件夹，请建立之) 4、 在IE浏览器的地址栏输入d:\myweb\yoyo.htm;显示如图9-1; 图9-1 网页头部代码与相应显示 5、 在“记事本”窗口输入以下语句:

欢迎进入悠悠网

6、 保存记事本文件，并刷新IE浏览器窗口，显示如图9-2;(请先将C:\data中的woman.gif 文件复制到D:\myweb下) 图9-2 字体与图片代码与相应显示 7、 在“记事本”窗口输入以下语句(注意被超链接的文件地址书写格式):

---

我叫悠悠，这里是我的 家，欢迎大家来这里听歌喝茶(当然也有coffee了)～

撒拉.布莱曼的《There for me》

撒拉.布莱曼的《The Winter of July》

8、 保存记事本文件，并刷新IE浏览器窗口，显示如图9-3; 图9,3 超链接代码与相应显示 9、 在“记事本”窗口输入以下语句(注意发送电子邮件的超链接的书写格式):

还想听什么歌，告诉我啊～ youyou2001@263.net

10、 保存记事本文件，并刷新IE浏览器窗口，显示如图9-4; 图9,4 邮件超链接代码与相应显示 11、 自此，该网页结束，点击超链接，检查链接是否正确，如果不正确，检查被链 接文件是否在其设定的目录内。 实验二 使用FrontPage 2000设计个人网页 【实验目的】 通过本实验，使学生掌握利用FrontPage 2000建立简单个人网页的。 【实验内容】 1、 创建有框架网页; 2、 插入图片，并设置图片的超级链接; 3、 设置背景图案和背景音乐; 4、 插入活动字幕; 5、 设置悬停按钮; 6、 设置邮件地址超链接。 【实验步骤】 1、 创建有框架网页。 (1) 启动FrontPage 2000; (2) 单击“文件”,>“新建”,>“网页”; (3) 在弹出的“新建”对话框中，选择“框架网页”选项卡; (4) 单击“目录”图标,>“确定”，如图9,5; 图9,5 新建框架网页 (5) 单击左侧和右侧框架的“新建网页”按钮，建立两个新页面; ) 单击“保存”按钮; (6 (7) 在弹出的“另存为”对话框中，给左边的框架取名为“left”，给右边的框架取名为“right”，给整个框架取名为“index”，如图9,6; 图9,6 框架网页的保存 (8) 在左侧框架任意位置右击，在弹出的快捷菜单中，选择“框架属性”; (9) 在弹出的“框架属性”对话框中，将“可在浏览器中调整大小”前的对勾去掉，并在“显示滚动条”下拉列中选择“不显示”，如图9,7; 图9,7 “框架属性”设置 (10) 单击“框架网页”按钮，在弹出的“网页属性”对话框中，去掉“显示边框”前 的对勾，如图9,8; 图9,8 “网页属性”对话框 (11) 在右窗口输入网页介绍文字，其字体、段落格式的设置同WORD，略; 2、 插入图片，并设置图片的超级链接 (1) 在左窗口任意位置单击，点击“插入”,>“图片”,>“来自文件”; (2) 在弹出的窗口中选择已经编辑好的图片(C:\DATA目录中); (3) 单击图片，出现“图片”工具栏; (4) 选择“图片”工具栏中的“长方形热点”工具按钮; (5) 在图片的“网页介绍”四个字区域自左上至右下拖动鼠标，拖出热点区域; (6) 松开鼠标，在弹出的“插入超链接”对话框中，选择文件RIGHT.HTM; 3、 设置背景图案和背景音乐。 (1) 单击右框架任意位置，单击“格式”,>“背景”，在弹出的“网页属性”对话框 中，选择已存在的图片，如图9-9; 图9-9 设置背景图案 (2) 右击左窗口，在弹出的快捷菜单中，选择“网页属性”; (3) 在“网页属性”对话框中，选择“常规”选项卡，单击“浏览”按钮选择背景音乐 文件; (4) 如果希望音乐循环播放，则选择“不限次数”，如图9,10; 图9,10 设置背景音乐 4、 插入活动字幕 (1) 在需要插入活动字幕的位置单击，设置插入点; (2) 单击“插入”,>“组件”,>“字幕”，弹出“字幕属性”对话框，如图9,11; 图9,11 “字幕属性”对话框 (3) 在“文本”编辑框中输入显示的活动字幕; (4) 适当设置“方向”、“速度”、“表现方式”，单击“确定”，如图9,12; 图9,12 “字幕属性”输入 5、 设置悬停按钮。 (1) 选择相应文字，如邮件地址; (2) 选择“格式”,>“动态HTML”，显示“DHTML 效果”工具条，如图9,13; 图9,13 “DHTML 效果”工具条 (1) 在“选择一种事件”下拉列表中，选择“鼠标悬停”; (2) 在“应用”下拉列表中选择“格式”; (3) 在“选择设置”下拉列表中选择“字体”; (4) 在“字体”对话框中适当设置，使得鼠标在此处悬停时，产生变化; 6、 设置邮件地址超链接。 (1) 选中邮件地址，在选中区域右击; (2) 在弹出的快捷菜单中，选择“超链接”; (3) 在弹出的“插入超链接”对话框中，选择“链接到”,>“电子邮件地址”; (4) 在电子邮件文本框中输入自己的电子邮件地址，如图9,14; 自此，一个简单的个人网页已经初具规模，读者可以依照本节的，完成其它超链接， 如“音乐欣赏”、“个人心语”等。有一点需要学生注意，虽然图片和音乐可以为网页添色 不少，但也影响了该网页的浏览速度，因此，读者尽量选取体积小的GIF、JEPG格式的图片 文件、压缩比较高的音频文件，如WMA、MP3格式的文件。