如何用记事本建立简单的网页(1).docVIP

第九章 网页制作 实验一 用记事本建立简单的HTML文件 【实验目的】 学会用HTML语言建立一个简单的网页。 【实验内容】 建立一个网页，布局自定，包括自我介绍、图片、自己的电子信箱地址等，要求在标题与正文之间插入一条水平线。(实验中所用到的图片、音乐等素材均可在计算中心配备的计算机中找到，具体路径为C:\DATA) 【实验步骤】 启动“记事本”和“IE浏览器”，并纵向平铺两窗口； 在“记事本”窗口输入下面的代码： html head title欢迎光临悠悠小屋/title /head 保存该文件到D:\myweb文件夹中，取名为“yoyo.htm”；（注意，文件的扩展名一定为.htm或html；如果没有myweb文件夹，请建立之） 在IE浏览器的地址栏输入d:\myweb\yoyo.htm；显示如图9-1； 图9-1 网页头部代码与相应显示 在“记事本”窗口输入以下语句：bodyh2 align=centerfont color=blue face=楷体 欢迎进入悠悠网/fontpimg border=0 src=d:\myweb\woman.gif Width=138 height=169/p/h2 保存记事本文件，并刷新IE浏览器窗口，显示如图9-2；（请先将C:\data中的woman.gif文件复制到D:\myweb下） 图9-2 字体与图片代码与相应显示 在“记事本”窗口输入以下语句(注意被超链接的文件地址书写格式)：hrp align=centerfont face=幼圆 size=3 color=#3366FF我叫悠悠，这里是我的家，欢迎大家来这里听歌喝茶（当然也有coffee了）！/font/pp align=center撒拉.布莱曼的a href=file:///D:/Myweb/Music/moon/there for me.mp3《There for me》/a/pp align=center撒拉.布莱曼的a href=file:///D:/Myweb/Music/moon/THe Winter of July.mp3《The Winter of July》/a/p 保存记事本文件，并刷新IE浏览器窗口，显示如图9-3； 图9－3 超链接代码与相应显示 在“记事本”窗口输入以下语句(注意发送电子邮件的超链接的书写格式)： p align=leftfont color=#808000 face=幼圆还想听什么歌，告诉我啊！a href=mailto:youyou2001@263.netyouyou2001@263.net/a/font/p/body/html 保存记事本文件，并刷新IE浏览器窗口，显示如图9-4； 图9－4 邮件超链接代码与相应显示 自此，该网页设计结束，点击超链接，检查链接是否正确，如果不正确，检查被链接文件是否在其设定的目录内。 实验二 使用FrontPage 2000设计个人网页 【实验目的】 通过本实验，使学生掌握利用FrontPage 2000建立简单个人网页的方法。 【实验内容】 创建有框架网页； 插入图片，并设置图片的超级链接； 设置背景图案和背景音乐； 插入活动字幕； 设置悬停按钮； 设置邮件地址超链接。 【实验步骤】 创建有框架网页。 启动FrontPage 2000； 单击“文件”－“新建”－“网页”； 在弹出的“新建”对话框中，选择“框架网页”选项卡； 单击“目录”图标－“确定”，如图9－5； 图9－5 新建框架网页 单击左侧和右侧框架的“新建网页”按钮，建立两个新页面； 单击“保存”按钮； 在弹出的“另存为”对话框中，给左边的框架取名为“left”，给右边的框架取名为“right”，给整个框架取名为“index”，如图9－6； 图9－6 框架网页的保存 在左侧框架任意位置右击，在弹出的快捷菜单中，选择“框架属性”； 在弹出的“框架属性”对话框中，将“可在浏览器中调整大小”前的对勾去掉，并在“显示滚动条”下拉列表中选择“不显示”，如图9－7； 图9－7 “框架属性”设置 单击“框架网页”按钮，在弹出的“网页属性”对话框中，去掉“显示边框”前的对勾，如图9－8； 图9－8 “网页属性”对话框 在右窗口输入网页介绍文字，其字体、段落格式的设置同WORD，略； 插入图片，并设置图片的超级链接 在左窗口任意位置单击，点击“插入”－“图片”－“来自文件”； 在弹出的窗口中选择已经编辑好的图片（C:\DATA目录中）； 单击图片，出现“图片”工具栏； 选择“图片”工具栏中的“长方形热点”工具按钮； 在图片的“网页介绍”四个字区域自左上至右下拖动鼠标，拖出热点区域； 松开鼠标，在弹出的“插入超链接”对话