第1章 HTML页面与表格 HTML PPT 课件.pptVIP

第一章 HTML页面与表格 课程目标 HTML文件的结构 如何设置HTML文件的背景色及文本色 如何在页面上添加一个超链接 如何在页面上添加一个表格 如何设置表格的属性 体验 创建使用超链接和表格的HTML页面 本章我们首先创建一个HTML页面。在页面中创建一个超链接，使超链接指向另一个显示信息的页面。在显示信息的页面中，以表格的形式显示信息。如图1-1、1-2所示： 超文本标记语言——HTML HTML标记 基本格式 标记内可以包含一些属性 HTML文档 HTML页面的基本结构 起始标记 文件头 HTML页面的基本结构 起始标记 文件头 文件头 Head/Head标记对构成HTML文档的开头部分 页面主体格式和页面效果 Body/Body标记对之间的内容是HTML文档的主要部分，在此标记对之间可包含众多的标记和信息 Body标记中还可以设置一些属性 页面链接 页面链接的基本概念 外部链接 内部链接 邮件链接 外部链接 链接到外面去，可以扩充您网站的实用性及充实性，也正因这功能，才造就了www五彩缤纷的世界。 一个超链接通常由以下3个部分构成： 内部链接 有时候，当某页的内容很多时，我们可以利用网页的内部链接，以便使用者快速的找到资料 原理： 内部链接实例 邮件链接 邮件链接可使访问者在浏览页面时，只需单击电子邮件链接就能打开默认的邮件编辑软件，向指定的地址发送邮件 格式 表格 表格的基本形式 有通栏的表格 表的大小，边框宽度，表格间距 表格中文本的输出 表格在文件中的位置定义 表格颜色 表格的基本形式 表格，一般用于对网页的内容进行排版 一个表格由table标记开始，/table结束 表的内容由tr,th和td定义 表格的例子 有通栏的表格 1．有横向通栏的表格用td colspan=#属性说明 2．有纵向通栏的表格用td rowspan=#属性说明 横向通栏示例 表的大小，边框宽度，表格间距 1．表的大小用width=#和height=#属性说明 2．边框宽度由border=#说明 3．表格间距即划分表格的线的粗细用cellspacing=#表示 表格的粗细 表格中文本的输出 1．文本与表框的距离用cellpadding=#设置 2．表格的宽度大于其中的文本宽度时，文本在其中的输出位置用“align=#”定义 3．表格的高度大于其中文本的高度时，可以用valign=#说明文本在其中的位置。 文本与表框的距离 表格的高度大于其中文本的高度 表格在文件中的位置定义 表格与文件中内容对齐时，若在现在位置上不能满足其对齐方式，可定义其位置，以满足对齐要求 属性一般由align=left、right或center指定 表格颜色 表格的颜色用bgcolor=#指定 * * 使学生能设计并实现下列各种程序 通过本章的学习要对HTML文件有初步地了解，并且可以灵活的设置超链接以及表格的属性 标记文件内容/标记 标记名称 属性1 属性2 属性3 …… 起始标记 网页标题 文件主体 Html Head 网页的标题和属性 /Head Body 文件主体 /Body /Html 基本结构 Html 标记符号 Html标记用于HTML文档的最前面，用来标记HTML文档的开始 /Html则是放在HTML文档的最后面，用来表示HTML文档的结束 两个标记必须一起使用 /Html Head/Head 结构 文件头标记对构成HTML文档的开头部分 用来描述HTML文档相关信息 1．Title标记 Title/Title 2．Base标记 Base href=”URL” 3．Link标记 Link rev=”RELATIONSHIP” reL=”RELATIONSHIP” href=”URL” 4．Meta标记 Meta http-equiv=”Content-Type” content=”text/html; charset=gb2312” 两个标记必须一起使用 了解路径 绝对路径 相对路径 绝对路径是指完整的描述文件位置的路径 所谓相对路径，顾名思义就是自己相对与目标位置 超链接标记a/a 属性href及其值 超链接中显示页面上显示链接的文字 a Href=””新浪网/a 在欲链接处做个记号 链接时就寻找个这记号 内部链接就是网页中的书签 格式 a Name=”书签名称”书签内容/a 例如，先定义一个标签a，然后找到“标签名”这个标签，就可编写如下代码： a name=”标签a”书签内