HTML5与CSS3基础教程

图5.1.1 全彩的照片应保存为JPEG或PNG-24格式 图5.1.2 标志和计算机生成的其他图像（即只有少数几种颜色的图像） 可通过ZIP有效地压缩，因此通常保存为PNG-8格式 图5.4.1 Save for Web ＆ Devices对话框。它显示原始图像（左上）和 三个可能的压缩后的版本。这个图像有很多纯色，还有应该保持锐利的 文本。可以看到，PNG-8格式（左下）的压缩程度最高，压缩后不到 10K。PNG-24可用的颜色更多，压缩后为35K。高质量的JPEG则非常 大。如果将JPEG调整为中等质量（未显示），也仍然比较大，还比较 难看 图5.4.2 JPEG（左下）的图像质量最好，文件也最小（63K）。PNG-8 压缩只留下了照片的色带（右下），且文件大小（114K）也几乎是 JPEG的两倍。PNG-24（右上）可以呈现高质量的图像，但文件也大得 多（322K） 图5.4.3 注意，PNG-8图像（左下）比其Photoshop副本文件略小一些。 而另两种格式，即JPEG（右上）和PNG-24（右下），则大一些 图5.4.4 Fireworks对图像的优化效果明显好一些，JPEG（左下）、 PNG-8（右下）和PNG-24（右上）的文件大小都更小一些。JPEG和 PNG-8文件大小只有Photoshop的一半 图7.3.3 图7.3.1中并没有显式地指定em和small元素的样式，它们将从 其父元素p那里继承字体、粗体和颜色。斜体来自浏览器为em设的默认 样式。出于同样的原因，由small（表示法律“细则”）标记的法律通告的 字号要比普通文本的小。h1本身没有设置样式，它也不是p的子元素， 因此它完全根据浏览器的默认样式进行显示 图7.4.6 CSS中最常见的定义颜色的方式是以十六进制数字的形式指定 颜色包含的红、绿、蓝的量 图7.4.10 这个示例不够真实但很有效，从中我们可以看到页面背景图 透过了前两个标题的背景，但没有透过最后一个标题的背景。这三个标 题的背景色都是一样的，但由于alpha透明度不同，它们看起来就像是深 浅不同的三种紫色。（文字是黄色的，这是由为body元素设置的color属 性传递下来的，除非为另一个元素设置的样式规则覆盖它，否则页面上 所有的文字都会显示为黄色。） 图8.2.3 将这个样式规则（4像素宽的红色实线边框）应用于每个img元 素 图8.2.4 其他文档也可以链接到同一个样式表，并拥有同样的样式 图8.7.5 页面加载以后，图像有虚线边框（首选样式的值覆盖了基本样 式的实线值，但基本样式中的颜色被保留下来了）。如果用户选择 Dotted，就将使用替代样式表 图9.2.3 所有的h2元......