《Head First HTML与CSS》笔记——5为页面增加图像

前言

这是HTML基础知识的最后一章了。一起来看看有哪些内容吧。

浏览器处理图像

浏览器对<img>元素的处理与其他元素稍有不同。在处理如<h1>或<p>元素时，只需要把它们显示出来。不过，浏览器看到一个<img>元素，在显示这个图像之前，必须先获取图像。

获取图像包括一下四步：

1. 浏览器从服务器获取html文件。
2. 读取html文件，发现需要获取的图像。
3. 浏览器依次获取并显示一个图像。
4. 对页面上每一个图像重复这个过程。

<img>元素

元素介绍

<img>元素中的src属性不仅可以放入相对或绝对路径，也可以放入URL，比如放入一个网站上的某张图片：

一定要提供候选格式

<img>元素有一个alt属性，当浏览器无法显示图像时，可以为访问者提供一些提示，告诉它们图像里有什么信息，比如：

调整图像大小

<img>元素还有一对属性用来调整图像大小：width和height。可以用这些属性提前告诉浏览器你的页面中一个图像的大小，比如：

• 可以提供比图像实际尺寸更大或更小的宽度和高度值，这样浏览器会缩放图像来满足指定大小。
• 可以只指定width和height中的一个属性。
• 如果页面中有很大的图像，则这个页面会很难使用，访问者没有办法一次看到完整的图像，滚动也会很麻烦。
• 剋有通过软件编辑图像大小以适合浏览器。

使用缩略图

把缩略图变成链接

总结