该如何选择 background-image 和 img 标签

水墨寒

用img标签

  1. 如果你希望别人打印页面时候包含这张图片请使用 img 标签
  2. 当这张图片有非常有意义的语义,比如警告图标,请使用img标签及它的alt属性。这样意味着你可以向所有的用户终端现实他的意义。
  3. IE6下 背景图片不能益出父级元素 要使用img multiple overlay images in IE6.
  4. 如果你使用动画img动画要比background-image 表现更好improve performance of animations over a background

什么时候用 CSS background-image

  1. 如果图片不是内容的一部分使用 background-image
  2. 如果使用图片替换文字请使用 background-image
  3. 如果你不希望别人打印页面时候包含这张图片请使用 background-image
  4. 如果你想改善加载时间 使用 CSS sprites
  5. 如果你只想用一张图片的一部分 请使用 CSS sprites
  6. 用background-image 以及 background-size:cover 拉伸填充整个窗口
阅读 3.9k

Yun.kou
前端工程师,目前在金山西山居就职。崇尚前端与视觉一体化设计。

前端工程师-UX玩家-UI设计师-多肉植物爱好者-电影狂人-佛学爱好者

1.1k 声望
50 粉丝
0 条评论

前端工程师-UX玩家-UI设计师-多肉植物爱好者-电影狂人-佛学爱好者

1.1k 声望
50 粉丝
文章目录
宣传栏