在文档中简单地插入一张图片
准备一张图片，可以是本地的，也可以是网上的，但是地址一定要清楚。
需要用到的元素是空元素<img>, 属性是src,完整的元素是：
<img src="picture.jpg">
上面的路径只是举例，这个路径表明这张图在本地而且跟本html文档在同一个文件夹里；如果是网上的图片只需将其改成图片显示页的URL即可，但是网上的图片不可控因素太多，最好不用。
为图片增加替代文本
如果因为图片路径或者标记语言错误导致图片无法显示，那么最好能够在图片因该显示的部分出现提醒文字，这些文字即替代文本，用到的属性是alt，完整元素为：
<img src="picture.jpg" alt="this is my home in anyang" >
代替语言非常重要，屏幕阅读器会阅读这些文字，搜索引擎也会浏览这些文字，用户选择不显示图片的话也需要这文字来提醒。
选择怎样的替代文字的关键是想清楚如果没有图片显示的话，需要给出怎样的文本用户才不会遗漏必要的内容，但是最好不要重复主要内容中的内容。
不同属性之间用一个空格隔开，顺序没有区别。
为图片设置大小
服务器一般都是先传输给用户html文档，浏览器解读文档的过程中遇到图片时会向服务器提出申请，服务器才会将图片传给用户。也就是说，文本是先于图片再浏览器上显示的。如果不给图片流出空间的话，等图片传过来页面就需要重新排版，就使得效率降低。所以就需要事先给图片留出空间，图片到了以后直接在留出的空间显示。需要的元素为width 和 height，完整元素为：
<img src="picture.jpg" alt="this is my home in anyang" width="12" height="12">
如果需要css再次修改图片的样式，上面的写法就是正确的，但是如果不希望外界的css对图片的大小进行更改则图片大小应该用style属性进行定义，完整的元素应该是这样的：<img src="picture.jpg" alt="this is my home in anyang" style="width:12px;height:12px;">
style中不同值之间应该用semicolon隔开
为图片添加提示信息
如果希望在鼠标放在图片上时出现图片的介绍内容，作为一种提示信息，可以用title属性，完整的元素变成：
<img src="picture.jpg" alt="this is my home in anyang" width="12" height="12" title＝"my home">
title 不是很重要，只有在正文没有足够篇幅介绍的时候才添加，比如博物馆中。
把图片作为链接使用
如果希望点击图片时页面跳转到其他地方，则需要将整个图片元素nest到链接元素的显示内容中，完整元素为：
<a href="www.google.com"><img src="picture.jpg" alt="this is my home in anyang" width="12" height="12" title＝"my home"></a>
这样点击图片后页面会跳转到Google主页。