第二章基文档标记.ppt

第二章 基本文档标记 本章内容： 标题标签h1--h6 段落标签p 列表标签 无序列表 ul 有序列表 ol 定义列表 dl 预格式化标签 pre 上标和下标 supsub 换行标签 br 水平线标签 hr 注释标签!-- -- 特殊字符 图象 图象标签img 路径 链接 链接到当前文本 链接到外部文件 链接到邮件 图象做链接 图象映射 多媒体文件 嵌入多媒体 背景音乐 动画 视频 本章任务1：制作图文并茂的页面 任务2：创建图象映射 任务2:制作有背景音乐、动画和视频的页面 使用代码插入背景音乐 使用代码插入动画 使用代码插入视频 本章目标： 会使用基本标签h1-h6、p、pre、sup、sub、br、hr、!-- -- 、 特殊字符 会在文档中插入无序列表、有序列表和定义列表 会插入图片 并设定alt属性 会使用超级链接，链接到当前文本、外部文件、 邮件 会制作图像映射 会在文档中插入背景音乐、动画和视频 标题标签h1--h6 语义：这是一个标题 HTML提供了六级标题标签,用于显示文档的标题. h1-h6 h1最大,h6最小. 段落标签p 语义：这是一个段落 段落标记p用于标记段落的开始,/p用于标记段落的结束. 下一个p标签自动开始一个新的段落 列表标签 无序列表 项的顺序并不重要 包含在ul/ul标签中 其中的项用li/li来表示 例： ul li广西/li li广东/li li湖南/li /ul 有序列表 项应该按特定顺序阅读或办理。 包含在ol/ol标签内 列表项也用li/li表示 例： ol li星期一/li li星期二/li li星期三/li li星期四/li li星期五/li li星期六/li li星期日/li /ol 嵌套列表 例： 注意标签必须嵌套正确 ul li广西 ul li南宁/li li柳州/li li桂林/li /ul /li li广东 ul li广州/li li深圳/li li佛山/li /ul /li /ul 定义列表 不仅仅是项的集合更是项及其说明的集合 包含在dl/dl标签内 dt/dt定义项 dd/dd定义项说明 项和项说明之间有一种隐含的语义关系。 项说明可以是图片和链接 例： dl dt宝马/dt ddp宝马是驰名世界的汽车企业，也被认为是高档汽车生产业的先导。宝马公司创建于1916年，总部设在幕尼黑。80年来，它由最初的一家飞机引擎生产厂发展成为今天以高级轿车为主导……/p/dd dt奔驰/dt ddp奔驰汽车公司是世界上资格最老的厂家，以生产高质量、高性能的豪华汽车闻名于世。也是世界十大汽车公司之一……/p p奔驰公司总部设在德国斯图加特，雇员总数为18．5万人。年产汽车60万辆……/p/dd /dl pre标签(预格式化标签) pre/pre标签用于显示预先定义好格式的文本 上标和下标supsub pasup2/sup+bsup2/sup=csup2/sup/p pHsub2/subO/p br标签(换行标签) br 标签都产生一个强制的换行 br标签是单标签 使用br标签的时候要这样写：br / hr /标签 hr标签用于在页面上绘制水平线 注释标签!-- -- 注释可以包含文档说明、修改记录这类东西。 不会被浏览器显示，但访问者查看网页源代码可以看到他们。 图象 JPEG GIF PNG img /标签 img标签用于在文档中插入图象 img标签是单标签 src属性:指定一个URL，指向图形文件的位置 alt属性: 提供与图象等价的替代性文本。 width属性:图象宽度，单位像素 height属性: 图象高度，单位像素 路径 绝对路径 相对路径 根相对路径 超级链接 在文档中用a标签表示超级链接 href属性用于指定要链接文档的地址 链接到外部文件 a href=“外部文件url”我到另一个文件去/a 链接到当前文档的特定位置 使用id属性创建命名锚记 a id=“market”我是锚记market /a 跳转到锚记 a href=“# market”我去本页面的market 那里/a 扩展：链接到外部文档的的特定位置 在外部文档创建命名锚记 a id=“market”我是另外一个文档的锚记market /a 跳转到外部文档的锚记处 a href=“外部文件url # market”我去另外一个文档的market 那里/a 链接到邮件 a href=“mailto:收件人邮箱地址?subject=主题”/a 扩展：图象做链接 a href=“url”img src=“图象url” //a 练习：制作如下页面 要点： 要制作如图所示的网页，首先需要确定要使用的HTML标签。 使用标题标签（h1-h