当标签img要当背景的时候，img和backgrond-image如何选择？

Question

当img要当背景的时候，img和backgrond-image如何选择？

Answer 1

1、你 img 或者 background-image 其中某一个是否需要另做它用，如果是的话，你只能选择另外一个。

2、如果你图片本身比较大，且可能出在页面较高位置时（也就是用户无需滚动的第一屏就能看到的位置），如果你使用了背景图的方式加载的话则可能会有那么几秒时间用户页面上显示的一块空白，这可能会非常难看。比较好的方式是，你用 img 的方式嵌入图片，而在背景上写入一个跟嵌入图片主色调一致（或与页面和谐）的背景色，这样在用户第一次加载或低网速加载时，可以先显示跟页面整体和谐的背景色，然后再出现嵌入图片的方式。

ps1.关于第二种情况，我曾经在苹果官网看到类似处理，当时那个嵌入图片是一个中心放射状的造型。所以苹果在背景图（颜色）上还使用了与图片构图接近的渐变背景色。

ps2.我偶尔也将第二种情况用于没有整体解决方案，适配 retina 屏的快捷方式，简单的说就是，background-image 是一个 @1x 的图片，而 @2x 的图片放置在 img 里，按需加载。

Answer 2

When to use IMG vs. CSS background-image?

Answer 3

backgrond-image限制太多，跟img的能力差的不是一点半点，如果你需要控制背景图片的大小，建议使用img。

Answer 4

首先你说的话我不是非常明白什么叫做img做背景？？

然后我当做你要把一张图片当做背景。如果是这样的话有2个解决办法:

<div style="background-image:url(地址);width='';height:''"> <!--div中的就是背景我感觉你就是这个意思--> </div>
或者你直接把img做成背景