实训3：使用html语言制作网页下.pptVIP

实训3：使用HTML语言制作网页 （下） 一、实验目的 1、了解HTML及其显示原理 2、熟悉HTML的基本语法和文档结构 3、掌握HTML中常用的标签的作用及其主要属性的设置方法 4、会使用HTML制作简单的网页 二、实验内容 使用文本编辑工具例如记事本，完成网页HTML代码的编写，保存并在浏览器中查看效果的制作。网页中必须用到下面常用标签。 掌握常用的标签的作用、属性的设置。包括： 插入图像标签img 插入音视频标签embed 表格类标签table、tr、td. 超级链接标签a 列表标签ol、ul 了解其他标签 三、知识点分解 1、图像标签img 基本语法： img src=图像的地址 alt=提示文字 width=宽度值 height=高度值 border=边框宽度值/ 三、知识点分解 2、嵌入音视频embed 使用embed/embed标签可以在网页中放置音乐和电影等多媒体内容，注意这对标签中间没有内容。 基本语法： embed src=音视频文件地址 width=宽度值 height=高度值 align=对齐方式 autostart=打开方式 loop= 循环次数 hidden=是否可见/embed 三、知识点分解 3、表格类标签 HTML中的表格由若干行组成，每一行又由若干单元格组成，所以HTML中表格主要有三个标签：表格标签table、表格行标签tr和表格单元格标签td。表格在网页设计中有很重要的作用，除了普通的表格应用以外，表格经常用来进行网页的布局和定位，到后面章节还会详细的说明表格的使用。 表格标签table…/table 表格标签table的结束标签是/table，这对标签是一对容器标签，用于标明一个表格，tr和td标签只能在它的范围内使用。 表格行标签tr…/tr 用来表示表格的一行，是单元格（th或td）的容器，使用时要置于table容器里，结束标签可以省略。 表格单元格标签td…/td 表示一个单元格，是表格中装具体内容的容器，使用时要置于tr与/tr之间。 三、知识点分解 4、超级链接标签a……/a 可以简单地理解为链接就是在各个文件之间相互跳转的桥梁。要从一个文件跳转到另外一个文件，首先就要知道另外这个文件的位置，这个位置在计算机术语中又叫做路径。在计算机中，路径分为绝对路径和相对路径。 绝对路径为文件提供完整的路径，包括使用的协议等，比如http和ftp。如“”是百度网站的绝对路径。如果是链接到本地硬盘中的文件，则绝对路径是包括盘符在内的各级路径。相对路径是指和当前文档所在的文件夹相对的路径，相对路径最适合网站的内部链接。 超级链接分为内部链接和外部链接。内部链接指在同一个站点内部，不同HTML页面之间的链接关系。外部链接指跳转到当前站点的外部，跟其他站点的网页或其他元素之间的链接关系。一般情况下，内部链接一般使用相对路径，而外部链接则要使用绝对路径。 超级链接用一对标签a和/a来定义。 基本语法： a href=链接所指的URL地址 target=打开链接的目标窗口 title=鼠标划过提示文本 设置链接的文字或图片等内容/a 举例 body a href=2-1.html target=_blank title=这是文本链接的例子文本链接，链接到范例2-1/a a href=pic/ex2-10.jpg title=图片链接，点击打开大图img src=pic/ex2-10.jpg width=50 height=50//a pa href=sourse/21.rar 下载链接/a/p pa href=# title=这是空链接，你上当啦！ 空链接/a/p pa href=mailto:abc@126.com title=点击启动电子邮件收发软件 邮件链接/a/p /body 链接到新浪网站： a href= 新浪网/a 如果想要在本文档内部各个位置之间相互跳转，则需要先在跳转的目的地做个标记，即先设置一个命名锚记，设置命名锚记也是使用a标签，结合使用name属性为锚记命名就可以了。 基本语法： 设置命名锚记：A Name=锚记名/A 设置同一个文档内命名锚记链接： A href=#锚记名超级链接的文字/A 设置不同文档之间命名锚记链接： A href=“目标网页名称#锚记名”超级链接的文字/A 三、知识点分解 5、列表标签 列表标签的分类主要有两类：有序列表和无序列表。 有序列表包含在一对ol和/ol标签之中，每个列表项使用标签li来定义。 无序列表包含在一对ul和/ul标签之中，每个列表项与有序列表一样，也是使用使用标签li来定义。 有序列表 有序列表包含在一对ol和/ol中，使用li表示列表