使用背景图像作为页面结构？

Question

我在一个我们必须使用图像作为页面结构的地方工作，我想知道它是多么的错误，因为在我眼里是非常错误的...我永远无法完美的布局，因为难以在图像上修正正确的内容。

有没有正确的方法呢？有什么方法可以教我一个简单的方法吗？

示例：http://bit.ly/1GILaQs BG：http://bit.ly/1GILfDy

我们需要支持IE8，因此更难。

由于

Answer 1

阿曼达，你可以有一个可以重复的背景图像，布局背景的红色部分。那么你就可以拥有白色部分的div。我相信这是你能拥有的最好的。

我不相信会有一种神奇的方式可以为您提供所需的布局灵活性。考虑到布局的性质，您将不得不使用Photoshop并相应地调整内容。

Code School提供了一些很好的课程，他们有一个关于css的课程可以帮助你：https://www.codeschool.com/courses/css-cross-country

Answer 2

目标应该是减少该图像的文件大小，因为它非常大并且需要很长时间才能加载。并且还要使布局更加灵活，以便在您更改某些内容时不必打开图像编辑器并重新排列。

我不认为有可能在不使用大图像的情况下复制你所拥有的内容，但我要做的是尝试用更简单，更容易重复的模式替换一些元素。例如，用更简单的对称渐变替换红色背景，并从白色图像中移除阴影/折叠。然后，对于洗发水瓶，您可以使用单独的图像标签并将它们放在您的内容中。