第四章网页图像与链接精要.pptVIP

第四章 网页图像与链接 本章内容 4.1 网页图像 4.2 图文混排 4.3 网页链接 4.4 图像映射 4.1 网页图像 4.1.1 图像的基本语法 4.1.2 源属性（Src） 4.1.3 alt 属性 4.1.4 height和width属性 4.1.5 border 属性 4.1.6 align 属性 4.1.7 hspace 和 vspace 属性 4.1.1 图像的基本语法 在 HTML 中，图像由 img 标签定义。 img 是空标签，意思是说，它只包含属性，并且没有闭合标签。 基本语法： img src= url width= value height= value alt= value border= value / 语法解析： src定义图像路径， width定义图像宽度， height定义图像高度， alt定义图像说明文字， border定义图像边框粗细（边框颜色在css里设置）。 4.1.2 源属性（Src） src 指 source ，源属性的值是图像的 URL 地址。 img 标签的 src 属性是必需的。它的值是图像文件的 URL，也就是引用该图像的文件的的绝对路径或相对路径。 绝对 URL ： 指向其他站点（比src=/） 相对 URL ： 指向站点内的文件（比如 src=/i/image.gif） 定义图像的语法是： 4.1.3 alt 属性 img 标签的 alt 属性指定了替代文本，用于在图像无法显示或者用户禁用图像显示时，代替图像显示在浏览器中的内容。 当用户把鼠标移到图像上方，最新的浏览器会在一个文本框中显示描述性文本。 alt 属性的值是一个最多可以包含 1024 个字符的字符串，其中包括空格和标点。这个字符串必须包含在引号中。这段 alt 文本中可以包含对特殊字符的实体引用，但它不允许包含其他类别的标记，尤其是不允许有任何样式标签。 基本语法： 4.1.4 height和width属性（详解） img 标签的 height 和 width 属性设置图像的尺寸。 为图像指定 height 和 width 属性是一个好习惯。如果设置了这些属性，就可以在页面加载时为图像预留空间。 请不要通过 height 和 width 属性来缩放图像。正确的做法是，在网页上使用图像之前，应该通过软件把图像处理为合适的尺寸。 基本语法： 4.1.5 border 属性 img 标签的 border 属性规定图像周围的边框的宽度，就是说可以增加或去掉图像的边框。 默认地，图像是没有边框的（除非图像在 a 元素内部）。 使用 border 属性和一个用像素表示的宽度值就可以去掉 (border=“0”) 或加宽图像的边框。 该属性在 HTML 4 和 XHTML 中也不再被推荐使用了，同样是应该被样式所代替，但却依然被流行浏览器很好地支持着。 基本语法： 4.1.6 align 属性 img 标签的 align 属性定义了图像相对于周围元素的水平和垂直对齐方式。 HTML 和 XHTML 标准指定了 5 种图像对齐属性值：left、right、top 、middle 和 bottom。 Netscape 又增加了 4 种垂直对齐属性：texttop、absmiddle、baseline 和 absbottom；Internet Explorer 则增加了 center。 基本语法： align属性值 4.1.7 hspace 和 vspace 属性 img 标签的 hspace 和 vspace 属性可以设置图像周围的空间。 hspace，以像素为单位，指定图像左边和右边的文字与图像之间的间距；而 vspace 值则是上面的下面的文字与图像之间的距离的像素数。 基本语法： 4.2 图文混排 4.3 网页链接 4.3.1 超链接概述 4.3.2 超链接分类 4.3.3 内部链接 4.3.4 外部链接 4.3.5 锚点链接 4.3.6 其他链接 4.3.1 超链接概述 超链接是网页页面中最重要的元素之一，也是一个网站的灵魂。一个网站是由多个页面组成的，各个网页链接在一起后，才能真正构成一个网站。 所谓的超链接是指从一个网页指向一个目标的连接关系,这个目标可以是另一个网页,也可以是相同网页上的不同位置，还可以是一个图片，一个电子邮件地址，一个文件，甚至是一个应用程序。 在一个网页中用来超链接的对