PRO 用IMG标签

  1. Use IMG plus alt attribute if the image is part of the content such as a logo or diagram or person (real person, not stock photo people). —sanchothefat如果图片是内容的重要部分例如logo,人员信息的头像等,用img标签,别忘了alt属性
  2. Use IMG if you intend to have people print your page and you want the image to be included by default. —JayTee
    如果你想别人打印你的页面时连图片一起打印,那末用img
  3. Use IMG (with alt text) when the image has an important semantic meaning, such as a warning icon. This ensures that the meaning of the image can be communicated in all user-agents, including screen readers.  
    如果图片有很重要的语义,例如表示警告的图标,为了保证被别的客户端设备例如屏幕阅读器所识别,那末使用IMG标签,别忘了alt属性
  4. Use IMG if you rely on browser scaling to render an image in proportion to text size. 
    当用户改变文本尺寸比例时(通过浏览器如ctr+),使用IMG标签可以使图片正常按比例缩放
  5. Use IMG for multiple overlay images in IE6
    IE6下面多张图片交叠效果需要用IMG标签(具体用处不明)
  6. Use IMG with a z-index in order to stretch a background image to fill its entire window. 
    使用img标签以及z-index可以撑开整个窗口的背景图。(具体不知道啥意思)
  7. Using img instead of background-image can dramatically improve performance of animations over a background
    针对图片进行动画交互时使用img标签可显著提升性能

CON 用背景图

    1. Use CSS background images if the image is not part of the content. —sanchothefat
      图片不是内容的主体组成部分时,考虑用背景图
    2. Use CSS background images when doing image-replacement of text eg. paragraphs/headers. —sanchothefat
      需要使用图片替代文字的时候考虑用背景图,比如标题内容、段落内容,有时候需要用更有质感的图片替代部分内容
    3. Use background-image if you intend to have people print your page and you do not want the image to be included by default. —JayTee
      别人打印你的网页,你不想让他打印到图片时考虑用背景图
    4. Use background-image if you need to improve download times, as with CSS sprites.
      合图即css sprite可减少服务器请求次数,用背景图
    5. Use background-image if you need for only a portion of the image to be visible, as with CSS sprites.
      用背景图可以利用css的background-position控制图片的可见范围

以下内容为Stackoverflow上整理以作纪录的更多相关文章

  1. GitHub上整理

    GitHub上整理 技术站点 Hacker News:非常棒的针对编程的链接聚合网站 Programming reddit:同上 MSDN:微软相关的官方技术集中地,主要是文档类 infoq:企业级应 ...

  2. [转帖]GitHub上整理的一些工具

    GitHub上整理的一些工具   技术站点 Hacker News:非常棒的针对编程的链接聚合网站 Programming reddit:同上 MSDN:微软相关的官方技术集中地,主要是文档类 inf ...

  3. 为什么 StackOverflow 上的代码片段会摧毁你的项目?

    昨天公司里碰到一件令人哑然失笑的事情.帮朋友公司做的一个项目,做SIT测试的时候发现一些bug,仔细查了下原因,原来是因为当初觉得这个项目比较简单,交给了几个新入职的新丁,也算是给他们练练手,结果其中 ...

  4. 老码农教你在 StackOverflow 上谈笑风生

    作为一个高大上的码农,你肯定用到过 StackOverflow,必须的.会有人否定这个断言么?那他恐怕不是真正的码农,或者说还没入门.StackOverflow 对于码农的重要性,基本就和诸葛亮对刘备 ...

  5. stackoverflow上关于iOS的票数最多(最常见)的15个问题

    搞编程做项目的,没碰到bug.遇到问题,基本不可能.stackoverflow就是一个大型的开放的FAQ平台,你是问题制造者,也是答案提供者.本文列出至今stackoverflow上关于iOS的票数最 ...

  6. Stackoverflow上有哪些声望高or值得关注的国人

    Stackoverflow上有哪些声望高/值得关注的国人? 以下回答并不严格按照 Reputation 排名来列,也不收录不确定是Chinese(中国人或华人)的用户,欢迎补充- 1.李杨 @Li L ...

  7. 记一次在StackOverFlow上问问题的经历

    最近一直在做测试方面的事情,被测的一些功能需要连接到FTP服务器上.而我在做本地测试时为了方便,就使用java写了一个简单的ftp服务器,可以在命令行下直接启动运行. 当时在main函数里是这样写的. ...

  8. 我发现:在StackOverflow上拯救歪果仁十分有意思!

    菊长:火星特工们!今天是周五了,大家有什么提议? BeJavaGod:报告菊长!我发现,在StackOverflow上拯救歪果仁十分有意思! 噗哈哈,时不时遇到问题会使用到StackOverflow, ...

  9. TOGAF架构内容框架之内容元模型(上)

    TOGAF架构内容框架之内容元模型(上) 2. 内容元模型(Content Metamodel) 在TOGAF的眼中,企业架构是以一系列架构构建块为基础的,并将目录.矩阵和图形作为其具体展现方式.如果 ...

随机推荐

  1. js上传文件(图片)限制格式及大小为3M

    本文保存为.html文件用浏览器打开即可测试功能   <form id="form1" name="form1" method="post&qu ...

  2. MYSQL表中向SET类型的字段插入值时值之间不能有空格

    MYSQL 中有一种数据类型是 SET,首先我们查看一个包含 SET 类型字段的表结构: 接下来我们向表中插入数据: 按照上面的语句插入数据发现报错了,于是去掉了插入值之间的空格,然后插入成功:

  3. .NET Core、.NET Standard、Xamarin和.NET Framework对比

    近日,微软发布了.NET Core 2.0,但是开发人员中间仍然存在一些疑惑,就是.NET Core..NET Standard.Xamarin和.NET Framework有什么不同. .NET F ...

  4. django “如何”系列7:错误汇报

    当你正在运行一个公共的站点的时候,你应该关掉DEBUG设置.这将使你的服务器运行的更快,同时也能预防别有用心的用户从你的错误页面看到你应用的一些详细配置信息.然而,当debug为false的时候,你将 ...

  5. cvs 日常使用

    http://www.51testing.com/html/44/17144-2954.html http://www.chedong.com/tech/cvs_card.html

  6. SEO优化:WordPress发布文章主动推送到百度,加快收录保护原创

    工作实在太忙,也没时间打理网站.最近公司额外交待了一些网站 SEO 方面的优化任务让我关注(这就是啥都要会.啥都要做的苦逼运维的真实写照了...). 于是抽空看了下百度站长平台,至少看到了2个新消息: ...

  7. kube-state-metrics组件的安装调试

    在安装全家桶之前,可以先一个一个组件的突破. 上次试了一下node exporter用来导出服务器数据metrics. 而用于导出k8s集群数据的组件就是kube-state-metrics.它寄生于 ...

  8. macos不能打开windows samba共享问题(转载)

    转自:https://www.macx.cn/thread-2095377-1-1.html?mod=viewthread&tid=2095377&extra=page%253D1&a ...

  9. localStorage和sessionStorage的总结

    localStorage:没有时间限制的数据存储 API: 1.localStorage.setItem('name','wangwei')/localStorage.name='wangwei'存储 ...

  10. ubuntu右上角红色三角警告

    问题:ubuntu右上角红色三角感叹号警告,显示更新信息已过期The update information is outdated. 解决方案: 首先在“系统设置(system settings)”- ...