HTML中的图片

HTML中的图片

< img src=””>

图片的三种格式

JPG

  1. JPG适合照片,包含一千六百多种颜色,这是一种有损格式,因为照片缩小时会丢掉图像的一些信息
  2. 不支持透明度
  3. 文件比较小
  4. 不支持动画

PNG

  1. PNG支持上百种颜色,的图像。PNG有三种:<blockquote>

PNG-8,PNG-24,PNG-32
</blockquote> <p>取决于你需要表示多少种颜色。 </p>

  1. 这是一种无损格式
  2. 允许将颜色设置为“透明”,使图像下面的东西显示出来
  3. PNG文件的大小取决于颜色的多少

GIF

  1. gif图支持256种颜色
  2. 是一种“无损”格式
  3. 也可以设置透明度,但是只支持将一种颜色设置为“透明”
  4. GIF文件一般比JPEG文件大
  5. 支持动画——三种格式里唯一支持动画的

总结:
gif,png适合做小文本和logo图,JPEG适合照片
**

< img src=”” alt=”” width=”” height=””>

其中src表示图片地址,alt表示图片未被加载时显示的替代文字,width表示图片宽度,htight表示图片高度

最好不要用width和height控制图片大小,因为这样在获取网页资源的时候还是要加载原来的图片的,建议用ps调下分辨率再加载进去

如果想要将图片设置为跳转则在img标签嵌套在a标签内就可以了
**

#### 蒙版

蒙版即根据背景颜色柔滑文本边缘的一种效果,一般用于透明背景图片

**
如果把一个透明呢的图片放在web页面中,则要确定这个图像的蒙版颜色与web页面的背景色一致。
透明图像可以使用PNG或GIF格式

    原文作者:Bill
    原文地址: https://segmentfault.com/a/1190000019744459
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞