1. HTML中我们用img标签插入图像,在Web中常用的有三种:JPEG, PNG,GIF。

简单来讲,JPEG适合照片和复杂图像使用,而PNG或GIF适合单色图像、logo、和几何图形使用。

  • JPEG:适合连续色调图像,如照片;可以表示1600万种不同颜色图像;“有损”格式,压缩时候会丢失信息;不支持透明度和动画;文件较小。
  • PNG:适合单色图像和线条构成的图像,如logo、剪贴画、图像中的小文本;可以表示上百万种颜色,PNG有三种,PNG-8、PNG-24、PNG-32;“无损        格式”,压缩时候不丢失信息;允许“透明”;文件比JPEG大一些,与GIF相比要根据使用的颜色数。
  • GIF:类似于PNG,适合单色图像和线条构成的图像,如logo、剪贴画、图像中的小文本;可以表示最多256种颜色;“无损”格式;只允许一种颜色设置      为“透明”;文件比JPEG大;支持动画。

2.<img src=".." alt="..">

<img>元素是一个内联元素,src属性指定图像文件的位置,alt属性是对图像的一个有意义的描述。

3.如果把一个透明的图像放在Web页面中,则要确保这个图形的蒙板颜色与Web页面的背景色一致。

Head First HTML与CSS — 为你的页面加图像的更多相关文章

  1. 【vue】css解决“防抖动”——防止页面加载图片抖动

    overflow:hidden;height:0;padding-bottom:*; // 其中*处填 图片的高宽百分比=高/宽*100%

  2. asp.net使用httphandler打包多CSS或JS文件以加快页面加载速度

    介绍 使用许多小得JS.CSS文件代替一个庞大的JS或CSS文件来让代码获得更好的可维 护性,这是一个很好的实践.但这样做反过来却损失了网站的性能.虽然你应该将你的Javascript代码写在小文件中 ...

  3. 加载 CSS 时不影响页面渲染

    转自:http://www.oschina.net/translate/loading-css-without-blocking-render 本文展示了一种技术,它能通过异步下载样式表,以阻止它们的 ...

  4. nginx实现动态分离,解决css和js等图片加载问题

    改帖专门为使用nginx,通过nginx把请求转发到web服务器再返回客户端的时候,解决css和js和图片加载不出来的问题. 如果没安装nginx,请访问一下地址进行安装 http://www.cnb ...

  5. 判断脚本,图片,CSS,iframe等是否加载完成

    1.图片 <img id="MyImg" src="src"/>jquery实现:$("#MyImg").load(functi ...

  6. css 实现页面加载中等待效果

    <!DOCTYPE html> <html> <head> <title>css实现页面加载中,请稍候效果</title> <meta ...

  7. 利用css实现页面加载时旋转动画

    有时浏览一些网站时在刚加载页面时候会出现一个滚动动画如下图,特别是对于一些移动端的站点或者混合应用来说应该用户体验会好很多,扒了下页面发现是用css样式控制的,于是把页面以及css样式赋值了下来, h ...

  8. SpringMvc架构下css、js、jpg加载失败问题

    SpringMvc架构下css.js.jpg加载失败问题 springMvc搭建成功后,页面出现一些错误,jsp.js等静态资源加载失败.导致页面没有显示任何样式以及 此处原因很简单,是因为相对路径在 ...

  9. 关于html,css,js三者的加载顺序问题

    <head lang="en"> <meta charset="utf-8"> <title></title> ...

随机推荐

  1. 正则表达式中/g的含义

    关于正则表达式 g,m 参数的总结,为了回答“正则表达式(/[^0-9]/g,'')中的"/g"是什么意思?”   为了解答“正则表达式(/[^0-9]/g,'')中的" ...

  2. PHPCMSV9 采集网址后,再采集内容,报错:“采集采集内容 没有找到网址列表,请先进行网址采集”

    解决方法:直接清除v9_collection_history 表里的内容.

  3. php explode 用法详解

    定义和用法explode() 函数把字符串分割为数组. 语法explode(separator,string,limit)参数 描述 separator 必需.规定在哪里分割字符串.string 必需 ...

  4. 利用Python读取json数据并求数据平均值

    要做的事情:一共十二个月的json数据(即12个json文件),json数据的一个单元如下所示.读取这些数据,并求取各个(100多个)城市年.季度平均值. { "time_point&quo ...

  5. 《python基础教程》笔记之 字典

    字典创建 字典由多个键值对组成,每个键和对应值之间用冒号隔开,项之间用逗号隔开,而整个字典用一对大括号括起来,如 >>> phonebook={'alice':'0123', 'Be ...

  6. nhibernate 3.3 linq扩展

    nhibernate的sqlserver linq 全文检索搞了半天 方法一 ,扩展LinqToHqlGeneriatorsRegistry http://www.cnblogs.com/xiarug ...

  7. file_get_content、fsockopen和curl之间的优缺点

    file_get_content 优点:在抓取单个文件上,效率很高,返回没有头信息的文件. 缺点:在抓取远程文件时,和fopen一样容易出错.在抓取多个跨域文件时,未对DNS进行缓存,所以效率上不不高 ...

  8. webserver and application server

    http://www.diffen.com/difference/Application_Server_vs_Web_Server http://www.differencebetween.com/d ...

  9. Eric Pement的单行awk命令收集

    超实用的. awk1line_zh-CN.txt 可惜中文版的网址好像不能访问了.. HANDY ONE-LINE SCRIPTS FOR AWK 30 April 2008 Compiled by ...

  10. 许多js框架或js库的min版本是怎么做出来的?

    如jQuery,Bootstrap,AngularJs,这些都有min版本,代码更加精简,功能却相同.看了源代码,几乎不可读. 这种事情的工具类型叫做“minifier”.请看传送门:Minifica ...