开发者社区 问答 正文

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

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

展开
收起
a123456678 2016-03-26 11:39:16 2271 分享 版权
1 条回答
写回答
取消 提交回答
  • 1、你 img 或者 background-image 其中某一个是否需要另做它用,如果是的话,你只能选择另外一个。

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

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

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

    2019-07-17 19:15:57
    赞同 展开评论
问答地址: