在什么情况下使用HTML IMG标记来显示图像更合适，而不是CSS背景图像，反之亦然?
这些因素可能包括可访问性、浏览器支持、动态内容或任何类型的技术限制或可用性原则。
当前回答
正确使用IMG
如果您打算使用IMG 人们打印您的页面，您希望在默认情况下包含图像。 -JayTee 当图像具有重要的语义含义时，例如警告图标，使用IMG(带有alt文本)。这确保了图像的含义可以在所有用户代理(包括屏幕阅读器)中传达。
IMG的实用用途
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 Use IMG if you rely on browser scaling to render an image in proportion to text size. Use IMG for multiple overlay images in IE6. Use IMG with a z-index in order to stretch a background image to fill its entire window.Note, this is no longer true with CSS3 background-size; see #6 below. Using img instead of background-image can dramatically improve performance of animations over a background.
何时使用CSS背景图像
Use CSS background images if the image is not part of the content. —sanchothefat Use CSS background images when doing image-replacement of text eg. paragraphs/headers. —sanchothefat 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 Use background-image if you need to improve download times, as with CSS sprites. Use background-image if you need for only a portion of the image to be visible, as with CSS sprites. Use background-image with background-size:cover in order to stretch a background image to fill its entire window.
其他回答
对我来说，这是个非黑即白的决定。如果图像是内容的一部分，如logo、图表或人物(真实人物，而不是库存照片人物)，则使用<img />标记加上alt属性。其他的都有CSS背景图片。
另一个使用CSS背景图像的时间是在做文本的图像替换时。段落/头。
只在必要的时候使用背景图像，例如容器的图像是平铺的。
其中一个主要的优点是使用图像是更好的搜索引擎优化。
当我想让它们100%可拉伸时，我使用image而不是background-image，大多数浏览器都支持。
关于使用CSS TranslateX/Y(正确的html动画方式)动画图像-如果你做一个Chrome时间轴记录的CSS背景图像被动画和IMG标签被动画，你会发现绘制时间大大缩短了CSS背景图像。
图像的大小呢?如果我使用img标记，浏览器将缩放图像。如果我使用css背景，浏览器只是从较大的图像中切割一块。
