HTML语言介绍.pptVIP

copyright 2006 All Rights Reserved HTML语言简介 计算机教研室 HTML(HyperText Mark-up Language) 是一种标记语言 HTML本身只能描述静态页面 使用HTML标记和元素，可以： 控制页面和内容的外观 创建联机表单，收集用户的信息、执行事务等 插入动画 插入背景音乐 浏览器和编辑器 浏览HTML文件的工具 编辑HTML文件的工具 HTML页面结构 注释： !-- 注释内容 -- HTML文本的基本结构 html head 文档头部分 /head body 文档主题部分 /body /html 例 文字格式标记 设置标题：一共有6种格式的标题，各自显示不同大小的标题文字，格式如下： 　　 h1 属性=值… … /h1 　　 h2 属性=值… … /h2 …. 　　 h6 属性=值… … /h6 常用属性：align = 水平对齐方式 对齐方式如下： left: 左对齐（默认值） center: 居中 right: 右对齐 例 文字格式标记 设置字体： font face=? size=? color=? … /font 注：face-字体，size-大小，color-颜色 固定字体标记： b 加粗 /b i 斜体 /i strong 加强显示 /strong em 倾斜 /em big 放大显示 /big small 缩小显示 /small 例 文字格式标记 样式标记 u 下划线 /u s 删除线 /s sup上标/sup sub下标/sub pre原样显示/pre 例 文字版面标记 换行标记：br 段落标记：p 段落内容 /p 块标记：div 块内容 /div 对齐标记： center 居中对齐 /center p align=“left” 居左对齐 /p p align=“right” 居右对齐 /p 例 水平线标记 格式：hr 属性=值 … 作用：添加一条用于分隔文档内容的水平线 常用属性如下： align = 水平对齐方式（left/center/right） color = 线的颜色 noshade = 显示一条无阴影的实线 size = 线的宽度(以像素为单位) width = 线的长度(像素或占页面宽度的百分比) 例 特殊符号 问题：在输入文本时按了多次空格键，但打开网页时却只能看到一个空格？ 解决方法：每一个“nbsp”代表网页中的一个空格 问题：有时要插入一些特殊符号，如版权符号?和注册符号?等，但这些符号不能直接输入 解决方法：可以使用这些字符的实体名称或数字表示方式。 常用的特殊符号 例 其他标记 超文本链接标记：a href= …/a 使用超链接发送邮件 a href=mailto:lulinlin0707@校长邮箱/a 图像标记：img…/img src：表示图像文件的地址（URL） alt：无法显示图像时的文字说明 height：表示插入的图像的高度 width：表示插入的图像的宽度 vspace：表示插入图像上下空白区域的大小 hspace：表示插入图像左右空白区域的大小 align：表示插入的图像与周围文字的对齐方式 border：指定插入的图像的边框宽度 例 练习 表格Table 作用：由行和列组成，用来显示多条数据 构成：由标题、表头、行、单元格等部分组成 表格代码格式-1 表格代码格式-2 表格代码格式-3 增加单元间隔和单元填充 CELLSPACING 属性定义单元格之间的间距(以像素为单位)。CELLPADDING 属性定义表的单元格边界与单元格内容之间的间距(以像素为单位)。 TABLE BORDER = 2 CELLSPACING = 2 CELLPADDING = 6 TABLE BORDER = 2 BORDERCOLOR=“red” 单元格中数据的对齐方式 Align = left Align = center Align = right 例 练习 实现下图的效果 meta标签 meta http-equiv=“Content-Type” content=“text/html; charset=gb2312” 用来标记你的页面的解码方式 meta http-equiv=“refresh” content=“5;URL=” 用来自动刷新网页 例 层简介 使用多个层，可以将一个层放到另一个层的上面或下面。 Z-index顺序决定元素的显示顺序。 层就像一个包含内容的框架，可以将它放置在所需的位置。 使用层 在Web页中插入层时，可以使用四种标记进行设置：div，span，layer和ilayer。 Internet Explorer 4.0和Netscape Na