第4讲第五章HTML语言与网页制作（一）.ppt

第五章 HTML语言（一） HTML语言概述 HTML文件结构格式 HTML常用标记简介 文件格式标记 排版标记 文字格式标记 列表标记 图像标记 链接标记 影像地图 多媒体页面 HTML语言概述 HTML的特点 HTML: Hypertext Markup Language  HTML文档独立于计算机操作平台； 通常以“.html”或“htm”为文件后缀；为纯文本文件； HTML语言概述 标记 标记通常具有如下结构：标记名 [属性1=值1 属性2=值2…] 标记分为 成对标记：成对出现，一头一尾（结束标记前要加“/”） 单一标记 标记的书写格式如下： 标记名…文件内容/标记名 属性的取值应该用双引号引起来 不加引号也不会有问题，但若属性值中有空格，则必须把属性值用双引号引起来 HTML语言概述 保留字符 HTML语言概述 颜色 定义字体、页面背景、表格背景及超链接的颜色。通过利用颜色数据来定义这些对象的颜色属性。 HTML语言概述 HTML语言概述 HTML语言概述 HTML语言概述 长度单位 在编辑HTML文件时，可以用来定义水平线、表格边框、图像等对象的长、宽、高等一系列属性，同时也能用来定义这些对象在网页上的位置等属性 HTML语言概述 长度的表示有两种方式 绝对长度： 单位：像素（pixel） 相对长度： 单位：百分比（％） 相对长度描述了对象在浏览器窗口的所占的比例 HTML语言概述 绝对路径和相对路径 绝对路径 文件在硬盘上的真正路径。 例如：D:/myweb/web1.htmD:/images/tx.gif HTML语言概述 相对路径 目标文件相对当前网页的位置。 / 根目录 ； ../ 上一级； ../../ 上两级 HTML语言概述 例如： 当前网页文件为web1.htm 同一文件夹中的文件，直接写文件名即可如： web2.htm 下级文件夹中的文件，要加上文件夹名如：subweb/sub.htm 上级或兄弟文件夹中的文件，使用“../”，表示移到上一级目录，如：兄弟目录：../images/tx.gif 上级目录：../a.htm HTML语言概述 当前网页文件为sub.htm 上两级文件夹中的文件，使用“../../”，表示移到上两级目录，如：../../images/tx.gif HTML文档结构格式 完整的HTML文档结构模板 HTML文档结构格式 HTML常用标记简介(一)文件格式标记 文件主体标记——BODY标记 BODY的属性可以分为三类： 背景属性： BGCOLOR 背景色 BACKGROUND 背景图案 BGPROPERTIES 背景不随前景滚 动（ fixed） 文字属性： TEXT 正文文字颜色 LINK 链接文字颜色 ALINK 活动链接文字颜色  VLINK 已访问链接文字颜色 HTML常用标记简介——(一)文件格式标记 文件主体标记——BODY 留白属性 LEFTMARGIN 页面左侧的留白距离 TOPMARGIN 页面顶部的留白距离 HTML常用标记简介——(一)文件格式标记 文件主体标记——BODY HTML常用标记简介（二）排版标记 标题格式标记——Hn n：1-6 align属性：left、center、right HTML常用标记简介——（二）排版标记 强制换行标记——BR HTML无法用多个回车、空格、Tab键来调整文档段落的格式，可用HTML的标记来强制换行、分段。 HTML常用标记简介——（二）排版标记 段落格式标记 设置段落标记——P 属性：align HTML常用标记简介——（二）排版标记 设置段落格式标记——P 预排格式标记——PRE HTML常用标记简介——（二）排版标记 段落格式标记 分区显示标记——DIV 它的最终目的是给设计者另一种组织能力，有class、style、title、ID等属性。应用于样式表会更显威力 DIV 标记符可用于为文档分节，以便为文档的不同部分应用不同的段落格式 HTML常用标记简介——（二）排版标记 水平线标记——HR 属性：align、size(2pix)、width、noshade HTML常用标记简介——（二）排版标记 水平线标记——HR