深圳网站制作公司网页离不开图片的点缀。在网页中应用图片的方法，是很多网页制作新手都期待学习的重要内容。
矢量图与位图
1．矢量图——完美的几何图形
矢量图是通过组成图形的一些基本元素，如点、线、面、边框、填充色等信息通过计算的方式来显示图形的。这就好比在几何学里面通过圆心位置和半径来描述圆，当然还可以通过边框的粗细、颜色以及填充的颜色等数据去描述其样式。电脑在显示的时候则通过这些数据去绘制人们定义的图像。
矢量图的优点在于文件相对较小，并且放大、缩小时不会失真。其缺点是这些完美的几何图形很难表现自然度高的写实图像。
需要强调的是，在Web页面上所使用的图像都是位图，即便有些称为矢量图形（如矢量icon等），其也是通过矢量工具进行绘制然后再转成位图格式在Web页网上使用的（区别于像素绘制的图形）。
2．位图——神奇的拼图位图
又叫像素图或栅格图，它是通过记录图像中每一个点的颜色、深度、透明度等信息来存储和显示图像。一张位图就好比一幅大的拼图，只不过每个拼块都是一个纯色的像素点，当把这些不同颜色的像素点按照一定规律排列在一起的时候，就形成了人们所看到的图像。当放大一幅位图时，能看到这些拼片一样的像素点。
位图的优点是利于显示色彩层次丰富的写实图像。其缺点是文件较大，放大和缩小图像时会失真。
有损压缩和无损压缩
尽管人们在Web页面中所使用的JPG、PNG、GIF格式的图像都是位图，即它们都是通过记录像素点的数据来保存和显示图像，但这些不同格式的图像在记录这些数据时的方式却不一样，这涉及有损压缩和无损压缩的区别。
1．有损压缩——看到的不一定是真实的
JPG是最常见的采用有损压缩对图像信息进行处理的图片格式。JPG在存储图像时会把图像分解成8×8像素的栅格，然后对每个栅格的数据进行压缩处理。当放大一幅图像的时候，会发现这些8×8像素栅格中很多细节信息被去除，而通过一些特殊算法用附近的颜色进行填充。这就是用JPG格式存储图像有时会产生块状模糊的原因。
2．无损压缩——最精确的拼图
相对有损压缩无损压缩能真实地记录图像上每个像素点的数据信息，但为了压缩图像文件其会采取一些特殊的算法。无损压缩的压缩原理是先判断图像上哪些区域的颜色是相同的，哪些是不同的，然后把这些相同的数据信息进行压缩记录（例如对一片蓝色的天空只需要记录起点和终点的位置就可以了），而把不同的数据另外保存（例如天空上的白云和渐变等数据）。
PNG是最常见的一种无损压缩的图片格式。无损压缩在存储图像前会先判断图像上哪些地方是相同的哪些地方是不同的，为此需要对图像上出现的所有颜色进行索引，这些颜色称为索引色。索引色就好比绘制这幅图像的“调色板”，PNG格式在显示图像的时候会用“调色板”上的这些颜色去填充相应的位置。网站制作公司本文关于“网站制作中网页图像常识”的知识就介绍分享到这里，谢谢关注，博纳网络编辑整理。
当前文章链接：/construction/jzhyzx/3996.html
如果您觉得案例还不错请帮忙分享：
[声明]本网转载网络媒体稿件是为了传播更多的信息，此类稿件不代表本网观点，本网不承担此类稿件侵权行为的连带责任。故此，如果您发现本网站的内容侵犯了您的版权，请您的相关内容发至此邮箱【qin@198bona.com 】，我们在确认后，会立即删除，保证您的版权。
