何时使用图像以及何时在网页设计时使用背景图像？

Question

我是一个业余爱好者的webdesigner，使用html和CSS测试各种网站设计。然而，让我感到困惑的一件特别的事情是决定将图像用作标记或通过css或html将其用作背景。 这是他们的经验法则吗？

Answer 1

正如其中一个答案所指出的，您需要区分内容和实际页面样式。

让我详细说明一下。 background-image属性的用途是用于定义页面某个块的外观，无论是div还是p，要点的重点是您要定义页面的样子。在定义页面设计（模式，徽标，渐变等）的上下文中的图像几乎不应采用img标记的显式形式。该标签用于定义内容图像，这些图像与手头的新闻相关联 - 这是您试图描绘的故事所独有的。

区分这两个概念非常重要，因为它可以让你考虑一个独立于底层内容的好设计 - 应该如此。统一，优雅，精确。

所以，在审查中。使用background-image定义构成网站的各个块的外观，并在要添加特定于上下文的可视内容时使用经典 img标记。

Answer 2

问题是内容或样式是在图像上画线的好地方。

这张图片会重复使用吗？等

Answer 3

您是否希望图片成为文档流程的一部分，为搜索引擎（alt-text）提供说明？使用img标签。

如果要在图像上放置其他元素（如文本，版权信息），请使用背景图像。您甚至可以通过在背景图像上放置透明图像来组合它以获得一些效果。

此外，很多例子都是使用背景图像的定位来获得性能优势（“精灵”）。