文档介绍：实验九利用HTML与Frontpage 设计网页
实验目的
实验内容
实验步骤
一、实验目的
掌握HTML的基本结构;
掌握HTML的常用标记;
掌握网页中使用图片的方法;
掌握网页中使用超级链接的方法;
掌握网页中表格使用的方法;
掌握交互网页的制作。
二、实验内容
使用常用的HTML标记制作网页;
使用FrontPage制作网页。
三、实验步骤
HTML的基本结构
常用的HTML标记元素
列表
图片
超链接
表格
交互网页
FrontPage 2000
(一)HTML的基本结构
一个简单的HTML代码。
<HTML>
<HEAD>
<TITLE>我喜爱的站点</TITLE>
</HEAD>
<BODY>
<P>我喜爱的站点</P>
<P>包括<A HREF=“”>新浪</A>、
<A HREF=“”>搜狐</A>等。</P>
</BODY>
</HTML>
(二)常用的HTML标记元素
标记元素
功能
<HTML></HTML>
超文本文件的开始和结束
<HEAD></HEAD>
超文本文件头的起止
<TITLE></TITLE>
超文本标题的起止
<BODY></BODY>
超文本正文主体的起止
<Hn></Hn>
定义标题字体大小,n值为1-6
<CENTER></CENTER>
元素间的内容居中
<BR>
回车换行
<P></P>
段落的起止,也可以加空行
<B></B>
字体颜色加深
<I></I>
字体为斜体
<U></U>
下划线
<FONT></FONT>
变化字体大小和颜色
<PRE></PRE>
按原文格式
<OL></OL>
用序号显示一级标题
<UL></UL>
无序号显示一级标题
<LI>
清单条目,用于目录列表
<SUP></SUP>
上角标
<SUB></SUB>
下角标
<IMG></IMG>
插入图形图像文件
<A></A>
锚元素,定义超文本链接点
<TABLE></TABLE>
表格的起止
<TR></TR>
表中一行的起止
<TH></TH>
表头的起止
<TD></TD>
表格中一栏内容的起止
<CAPTION></CAPTION>
表格标题
看看下面代码的结果。
<HTML>
<HEAD>
<TITLE>页面文字</TITLE>
</HEAD>
<BODY>
<CENTER>
<H1>登鹳雀楼</H1>
<FONT FACE="楷体_GB2312" SIZE=3 COLOR=red>
白日依山尽,<BR>
黄河入海流。<BR>
欲穷千里目,<BR>
更上一层楼。
</FONT>
</CENTER>
</BODY>
</HTML>
(三)列表
<HTML>
<HEAD>
<TITLE>列表</TITLE>
</HEAD>
<BODY>
<P>这是一个有序列表:</P>
<OL>
国际互联网提供的服务有:
<LI>WWW服务
<LI>文件传输服务
<LI>电子邮件服务
<LI>远程登录服务
<LI>其他服务
</OL>
<P>这是一个无序列表:</P>
<UL>
国际互联网提供的服务有:
<LI>WWW服务
<LI>文件传输服务
<LI>电子邮件服务
<LI>远程登录服务
<LI>其他服务
</UL>
</BODY>
</HTML>
(四)图片
超文本支持的图片格式一般有X Bitmap(XBM)、GIF、JPEG三种。
插入图片的标签是<IMG>,其格式为: <IMG SRC="图片文件地址">。
SRC属性指明了所要链接的图片文件地址,这个图形文件可以是本地机器上的图形,也可以是位于远端主机上的图片。地址的表示方法可以沿用上一篇内容“文件的链接”中URL地址表示方法。
例: <IMG SRC="images/">
IMG属性有HEIGHT、WIDTH、BORDER、ALT等,分别表示图片的高、宽、边框、替代文字等。