流体设计的最佳实践是什么 - 使用 css 精灵或内联图像？ [关闭]答案

【问题标题】：What is best practice for fluid designs - using css sprites or inline images? [closed]流体设计的最佳实践是什么 - 使用 css 精灵或内联图像？ [关闭]
【发布时间】：2015-01-29 19:05:10
【问题描述】：

我正在开发一个应该具有流畅布局的网站。我目前面临一个难题：我应该使用 css sprite 还是选择内联图像？

所有图像都需要流畅，并在各自的屏幕尺寸上缩小/放大它们的尺寸。我正在考虑使用 CSS 精灵图像，但这意味着我需要识别所有主要的屏幕宽度，然后将所有图像与这些相应的宽度切片并将它们添加到我的精灵中......

我的问题是：在流体/响应式设计中渲染图像的最佳方法是什么？精灵、内联图像或两者的组合？

谢谢！

【问题讨论】：

关于“什么是最好的方法”的问题将产生基于意见的答案，因此对于 Stack Overflow 来说是题外话。
没错，但最佳做法是基于有关该主题的专家意见。所以我的问题是关于“与流体设计相关的精灵与内联图像”的最佳实践是什么。我相信鉴于这个论坛上有很多专家，我可以根据前端社区的一般大众方法来构建我的形象策略。如果您不相信有最佳实践选项，我很乐意结束这个问题。我相信问还是有意义的。

标签： css responsive-design sprite css-sprites fluid-layout

【解决方案1】：

我个人认为精灵有点不必要，现在互联网速度足够快，可以使用单独的 bg 图像。通过使用媒体查询显示正确的图像，并通过使用 background-size:cover 限制流体设计中的大小；或包含。

【讨论】：

这也是我做过的……我正在和自己争论是否有更好的方法。非常感谢您的回答亚伦。