如何为响应式网站设计背景图片？

Question

我一直在四处寻找答案或指南，但我似乎无法找到任何东西。我可能在这里错过了一个关键词。

我有一个单页网站，我想在Photoshop中设计一个背景图像。我希望能够围绕网页上的元素设计此图像。这对设计一个特定的屏幕尺寸来说不会太难，但是元件的位置和屏幕的宽度在各个设备之间会发生显着变化。我只有如何去这两个概念，两者都不似乎是一个好方法：

1. 创建忽略页面上的元素，并不会对左/右太多细节的背景图像在移动设备上切断。
2. 为每个设备大小创建一个单独的背景图像，并使用媒体查询来加载正确的图像。

有没有更好的方法去做这件事？

这里是那种背景我的示例屏幕截图是在说：

Answer 1

让地址是：“我如何去回应式网站设计的背景图像？”

显然，这个问题有多个正确的答案。最简单的解决方案（IMO）将创建一个高分辨率的图像，这是一个抽象的图像，因此当屏幕尺寸变小时，如果部分图像被切掉，就不会出现错误。您发布的网站上的背景图片使用此方法。木镶板的结果是与屏幕尺寸无关的设计。