2014年度辛星html教程夏季版第四节

我们前面也涉及了HTML中的一些东西，接下来我们要涉及到图像了，如果没有图像，即使文字的样式再多，再复杂，终归还是单调的，我们就需要用图片来给我们的网页增加更多的表现形式。

***************图片******************

1.我们用<img>标签来给我们的HTML文件导入一个图片，它是一个空标签，即它只包含属性，而且它没有相应的闭合标签，即它不用成对出现。

2.它的src属性应用于指定源属性地址，它可以是绝对路径，也可以是相对路径，还可以是一个网址，即一个URL，比如我们要引入的图片是百度的一张图片，那么可以写如下代码：

<img src="http://f.hiphotos.baidu.com/baike/c0%3Dbaike80%2C5%2C5%2C80%2C26/sign=e8f89e86b0fb43160e12722841cd2d46/ca1349540923dd5483db5925d309b3de9d8248d7.jpg">

3.当然上述代码有点长，主要是百度的地址比较长，这张图片，如果大家好奇，可以到自己的浏览器运行一下。

4.img标签还可以包括alt属性，它是当图片无法载入的时候用来显示的。

5.img标签还有一个width属性用于设置显示图像的宽度，用height属性来设置显示图片的高度。

6.如果一个标签有多个属性，那么需要用空格进行分开，并且属性的值需要用双引号引起来，以明确表示它的属性。

7.示例代码：

<img src="xinxing.gif" alt="辛星" width="300" height="400" />

****************路径问题**************

1.会想到我初学HTML的一些经历，在这里提醒大家一下关于路径的问题吧，img标签的src属性可以用绝对路径，也可以用相对路径。

2.比如我们编写的html和图片在同一目录下，且图片叫x.gif，那么就可以写代码为：<img src = "x.gif" />

****************小结**************

1.本节课我们介绍了HTML中关于图片的一些知识，希望大家可以理解。

2.但是真正的项目中，添加合适的图片却往往是一件比较费时费力的事情，我们往往要进行各种各样的切图，这些后面再说。