实验十四HTML页面的与设计.doc

实验十四 HTML页面的分析与设计（8学时） 【目的】掌握静态HTML页面的方法了解HTML语言特点，学会简单HTML页面的编写。 （1）HTML/HTML：此对标签用于标记一个页面的开始和结束。 （2）HEAD/HEAD：此对标签用于标记头部，主要用于对页面中使用的字符集、脚本语言、页面的标题、背景音乐、样式表单等进行说明和设置。 此标签内还可以嵌套TITLE/TITLE标签，用于显示网页标题。 （3）BODY/BODY：此对标签用于标记一个页面输出显示的开始和结束。该标签内包含Web页面的具体内容（文字、图形、图像、超链接等各种HTML对象）。 （4）举例 代码： HTML HEAD TITLE我的第一个Web页面/TITLE　　 /HEAD BODY 这是一个说明网页基本构成的HTML文档. /BODY /HTML 页面效果： 2、掌握文字风格设置 （1）字体标记FONT是一个带有属性的标记，通过其属性可以设置文本的字体、字号和颜色等。 标记格式：FONT FACE=字体 SIZE=字号 COLOR=颜色值……/FONT 说明： ①字体默认为宋体。 ②字号可以取1到7之间的值，1号字最小，7号字最大，默认值为3。 ③颜色值可以是以#号开头的6位十六进制值，也可是HTML预定义的色彩名。 ④代码举例： HTML HEAD TITLEFONT标记示例/TITLE /HEAD BODY FONT系统默认(3号黑色宋体,缺省FACE、SIZE和COLOR属性时)/FONT FONT SIZE=1 COLOR=red1号红色宋体字/FONT FONT FACE=隶书 SIZE=2 COLOR=#00ff002号绿色隶书字/FONT FONT FACE=楷体_GB2312 SIZE=3 COLOR=#0000ff3号蓝色楷字/FONT FONT FACE=黑体 SIZE=+1 COLOR=#ffff004号黄色黑体字/FONT　 FONT FACE=华文行楷 SIZE=+25号黑色行楷/FONT FONT FACE=华文彩云 SIZE=6 COLOR=#8080006号橄榄色彩云字/FONT　 FONT FACE=幼圆 SIZE=7 COLOR=gray7号灰色幼圆字/FONT /BODY /HTML 页面效果： （2）标题字标记 标记格式：Hi ALIGN=对齐方式……/Hi　　 说明： ①i=1，2，…，6。即标题字共分6级，分别用H1至H6表示，H1标记的字最大，H6标记的字最小。 ②ALIGN属性的对齐方式可以是left(左对齐)、center(居中对齐)、right(右对齐)、justify(两端对齐)四种中的某一种。 ③代码举例： HTML HEAD TITLE标题字标记示例/TITLE /HEAD BODY H1 ALIGN=leftH1号字/H1 H3 ALIGN=centerH3号字/H3 H5 ALIGN=rightH5号字/H5 /BODY /HTML 页面效果： （3）文字辅助变化标记 B/B：文字加粗 I/I：文字倾斜 U/U：文字下划线 SUB/SUB：标记字下错半行 SUP/SUP：标记字上错半行 代码举例： HTML HEAD TITLE文字变化标记示例/TITLE /HEAD BODY FONT SIZE=4 BB标记使字加粗/B II标记使字倾斜/I UU标记在字下加线/U SUBSUB标记使字下错半行/SUB SUPSUP标记使字上错半行/SUP /FONT /BODY /HTML 页面效果： （4）划线标记 标记格式：HR SIZE=线条粗细 WIDTH=线条长度 COLOR=线条颜色 说明： ①该标记的作用是画一条水平线，线的粗细和长度通过SIZE和WIDTH的值来设置。 ②SIZE和WIDTH的取值是一个整数，单位可以是px(像素)、pt(磅)、cm(厘米)。 ③代码举例： HTML HEAD TITLE文字变化标记示例/TITLE /HEAD BODY H2 ALIGN=center文字的变化1 HR SIZE=2 WIDTH=140 COLOR=Blue /H2 H4 ALIGN=left文字的变化2 HR SIZE=5 WIDTH=260 COLOR=Red /H4 /BODY /HTML 页面效果： （5）特殊字符标记 3、掌握段落控制标记方法 （1）换行标记BR，单边标记，不成对出现。 （2）段落标记 标记格式：P ALIGN=对齐方式……/P 说明： ① P和/