15、网页添加图片全攻略

网页添加图片全攻略

1. 处理损坏图片时的 alt 属性

在网页开发中，你无法确切知晓用户会使用何种浏览器和设备来访问你的页面。可能是移动设备、供视障人士使用的屏幕阅读器、通过慢速网络连接运行的浏览器（可能仅检索网站的文本而非图像）、手机，甚至是联网的T恤等。所以，为图片提供替代信息是很有必要的。

alt 属性的作用是，当图片无法显示时，浏览器会显示该属性中的文本。例如：

<img src="http://wickedlysmart.com/hfhtmlcss/trivia/pencil.png" 
     alt="The typical new pencil can draw a line 35 miles long.">

下面是测试 alt 属性的步骤：
1. 选取之前练习中的 HTML 文件。
2. 更新图片元素，添加 alt 属性，内容为 “The typical new pencil can draw a line 35 miles long.”
3. 将图片名称从 “pencil.png” 改为 “broken.png”，因为该图片实际上并不存在，这样你会得到一个损坏的图片。
4. 在浏览器中重新加载页面。
5. 下载其他几款浏览器并进行测试，观察结果是否不同。

2. <img> 元素的 width