资讯专栏INFORMATION COLUMN

HTML中的图片

godruoyi / 3162人阅读

摘要:中的图片图片的三种格式适合照片,包含一千六百多种颜色,这是一种有损格式,因为照片缩小时会丢掉图像的一些信息不支持透明度文件比较小不支持动画支持上百种颜色,的图像。

HTML中的图片
< img src="">
图片的三种格式
JPG

JPG适合照片,包含一千六百多种颜色,这是一种有损格式,因为照片缩小时会丢掉图像的一些信息

不支持透明度

文件比较小

不支持动画

PNG

PNG支持上百种颜色,的图像。PNG有三种:

PNG-8,PNG-24,PNG-32

取决于你需要表示多少种颜色。

这是一种无损格式

允许将颜色设置为“透明”,使图像下面的东西显示出来

PNG文件的大小取决于颜色的多少

GIF

gif图支持256种颜色

是一种“无损”格式

也可以设置透明度,但是只支持将一种颜色设置为“透明”

GIF文件一般比JPEG文件大

支持动画——三种格式里唯一支持动画的




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

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

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

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

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

#### 蒙版

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

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

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/114944.html

相关文章

  • 学习前端笔记1(HTML

    摘要:注此文是在看过许多学习资料和视频之后,加上自身理解拼凑而成,仅作学习之用。宋体无文档声明浏览器以怪异模式解析宋体标签宋体不使用宋体代码来实现页面表现宋体学习宋体重点在于语义性。(注:此文是在看过许多学习资料和视频之后,加上自身理解拼凑而成,仅作学习之用。若有版权问题,麻烦及时联系) 标准页面结构:       Html发展历史:    注:每一种HTML需要有对应的doctype声明。  ...

    xeblog 评论0 收藏0
  • HTML与CSS中的,链接与图像个人分享

    摘要:链接与图像链接元素元素表示链接元素作用从当前页面跳转到指定页面属性设置指定跳转页面的路径路径分类相对路径相对于当前页面的路径绝对路径访问的路径地址不变化示例代码相对路径的链接文本阴影案例他是链接绝对路径的链接他也 链接与图像 链接元素 < a >元素 - 表示链接元素 作用 - 从当前html页面跳转到指定html页面 属性 href - 设置指定跳转html页面的路径 ...

    cocopeak 评论0 收藏0
  • HTML与CSS中的,链接与图像个人分享

    摘要:链接与图像链接元素元素表示链接元素作用从当前页面跳转到指定页面属性设置指定跳转页面的路径路径分类相对路径相对于当前页面的路径绝对路径访问的路径地址不变化示例代码相对路径的链接文本阴影案例他是链接绝对路径的链接他也 链接与图像 链接元素 < a >元素 - 表示链接元素 作用 - 从当前html页面跳转到指定html页面 属性 href - 设置指定跳转html页面的路径 ...

    elisa.yang 评论0 收藏0
  • 基于html2canvas实现网页保存为图片图片清晰度优化

    摘要:本次技术调研来源于项目中的一个重要功能需求实现微信长按网页保存为截图。小结是目前实现网页保存为图片功能的综合最佳选择。 本次技术调研来源于H5项目中的一个重要功能需求:实现微信长按网页保存为截图。 这里有个栗子(请用微信打开,长按图片即可保存):3分钟探索你的知识边界 将整个网页保存为图片是一个十分有趣的功能,常见于H5活动页的结尾页分享。以下则是项目中调研和踩坑的一些小结和汇总。 ...

    JerryWangSAP 评论0 收藏0
  • 基于html2canvas实现网页保存为图片图片清晰度优化

    摘要:本次技术调研来源于项目中的一个重要功能需求实现微信长按网页保存为截图。小结是目前实现网页保存为图片功能的综合最佳选择。 本次技术调研来源于H5项目中的一个重要功能需求:实现微信长按网页保存为截图。 这里有个栗子(请用微信打开,长按图片即可保存):3分钟探索你的知识边界 将整个网页保存为图片是一个十分有趣的功能,常见于H5活动页的结尾页分享。以下则是项目中调研和踩坑的一些小结和汇总。 ...

    mayaohua 评论0 收藏0
  • 基于html2canvas实现网页保存为图片图片清晰度优化

    摘要:本次技术调研来源于项目中的一个重要功能需求实现微信长按网页保存为截图。小结是目前实现网页保存为图片功能的综合最佳选择。 本次技术调研来源于H5项目中的一个重要功能需求:实现微信长按网页保存为截图。 这里有个栗子(请用微信打开,长按图片即可保存):3分钟探索你的知识边界 将整个网页保存为图片是一个十分有趣的功能,常见于H5活动页的结尾页分享。以下则是项目中调研和踩坑的一些小结和汇总。 ...

    denson 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<