<分区>
要求提供代码的问题必须表现出对所解决问题的最低限度理解。包括尝试过的解决方案、为什么它们不起作用，以及预期结果。另请参阅:Stack Overflow question checklist
关闭 9 年前。
html - PSD 到 HTML - 如何执行我的背景图形？
我正在尝试创建我的第一个网站，并且我已经在 Photoshop 中创建了我的布局，但我不知道如何将我的图形元素放入适当的“div”中以实现我想要完成的目标与它。
这是我想出的布局，
我想要做的是，首先是标题，我希望彩色线条(线程)扩展浏览器宽度的 100%，同时 Logo 保持居中。我试过这样做，但是这些线程的整个宽度都在一个 .png 文件中(图像大小约为 100px x 1200px)，但这似乎有问题。
标题下方的“内容区域”图形是一种向内透视的方框，我想保持方框边缘的完整性，同时高度根据内容的多少不时波动到位。我怎样才能执行这个权利？我试着用我的盒子作为背景图像制作一个容器 div，高度为 100%，但图像似乎没有缩放。
最佳答案
好的，根据您的布局制作的好坏，我假设您已经将所有内容分成了层。如果你还没有，那就去做吧。
接下来，请注意我们现在通常使用重复模式。我们过去使用按比例缩小的巨型图像，但是这会占用大量数据，而且由于设计模式已经变得更加简单，我们只使用模式。
你所有的文本都可以很容易地用 CSS 完成，所以我们会忽略它。
接下来，隐藏除您正在处理的一个元素之外的每一层，然后转到文件>保存为网络。确保选择允许透明的文件格式。如果你想完全复制你的设计，你可能会有很多元素:标志、珠子、5 像素宽的绳子、水平边框、垂直边框和另一个图像你边界的每个 Angular 落。您也可以使用一张图片并在 CSS3 中旋转它们，但这并未得到广泛支持。
接下来，学习一些 HTML 和 CSS。说真的，不要贪多嚼不烂。
在您知道如何操作之后，然后将您的站点分成多个 div:一个标题、一个导航和一个正文。
对于页眉，将背景设置为您的小条并将背景重复设置为 x。
将 Logo 放在页眉内并将页边距设置为“0 自动”。这将使它居中。
同样，只需对文本使用 CSS。
最后，对于你的 body 边界与透视......这个有点难。您可以创建 3 个 div 并使用 top、sides、body 而不是 sides +corners。或者您可以坚持这样做并创建 4 个 div:每个边缘一个，每个 Angular 一个。
但是，我会坚持为您的边框使用 CSS。应用我所说的操作有点困难，您必须移除照明才能很好地平铺。使用 CSS3，如果你想做挤压，你可以设置一些很酷的阴影。
请注意，您不必这样做，我就是这样做的。
关于html - PSD 到 HTML - 如何执行我的背景图形？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18070721/