第五章：认识媒体-----为页面增加图像

认识三种图像格式

格式	最适合	有无损格式	是否支持透明度	是否支持动画	文件大小	其他
JPEG	连续色调图像，如照片	有损	不支持	否	比较小
PNG	最适合单色图像和线条构成的图像	无损	支持（包括上百万种不同颜色）	是	有三种PNG-8,PNG-24，PNG-32 取决于你需要表示多少种颜色
GIF	最适合单色图像和线条构成的图像	无损	支持（只支持最多256种不同颜色）	是	比较大

 

 

 

 

 

 

 

 

调整图像大小

<a href="images/red.jpg" width="48 "hight"="100">

这种方式可以调整图像大小，但是不建议用HTML调整大小，建议用CSS来实现，HTML是用来提供结构的，不是用来提供表现属性的。

所以书上教的用处理软件来进行压缩图像成缩略图。再把文件里图像地址改掉就好啦

可以看到改成压缩图之后，本来竖着排列的大图都变成了平行的缩略图，所以<img>是内联元素！它没有自动缩进！

现在网页显示的是缩略图，那么怎么能让用户点进去看大图呢，书里采用的方法是，将这个图片作为一个可点的链接，点进去之后是一个带有文字及大图的网页。这里就采用到了嵌套

<a href="../bigpicture.html" title="点开可以看大图">
    <img src="images/red.jpg">
</a>

 

利用<a>的alt属性为图像提供候选格式

什么意思呢，就是有时候网页的图片加载失败或者视力障碍的人看到这里是听网页，那么到图片这里就会显示或者念出alt属性的内容

<img src="images/red.gif" alt="红色的花，上边有一只蝴蝶">

蒙版

如果把一个透明的图像放在一个Web页面中，则要保证这个图像的蒙版颜色与Web页面的背景色一致

透明的图像可以使用PNG或者GIF格式