切片为网页,包含与其他部分重叠的圆形图像

时间:2015-02-12 17:20:20

标签: html css

我有一个带有图层的psd文件,这是我需要创建的网页的模型。您可以查看页面方案here。对于每个页面元素(标题,菜单,主体,页脚等),psd文件中都有图层。还有一些带有阴影的圆形图像也构成了图层,它们之间以及主体文本区域和页面标题重叠,正如您在页面方案中看到的那样。

我的问题是,在页面标记中导出切片以使用导出图像的正确方法是什么:

选项1:将圆形图像导出为基于图层的切片(在我关闭它们下面的任何其他图层之后)并使用图像的transperency属性。

选项2:导出包含页面部分(例如,主体)的矩形用户切片以及与此页面部分重叠的圆形图像部分。

例如,在第一种情况下,我会将所有3个圆形图像导出为基于图层的.png切片(在我关闭标题和主体图层之后),最后得到3个具有透明度的图像。然后我会用绝对定位放置这个图像,所以它与主体和标题重叠。

在第二种情况下,我会将整个标题部分与img1的重叠部分切片,然后我会切片菜单,然后切片主体部分,包括重叠它的图像部分然后我会在右边切出另一个切片,包含剩下的图像'零件等。如果您转到此link并单击模板缩略图,则可以使用类似于第二个选项的方法检查Firebug,关于页面左上角的浮动图像。

1 个答案:

答案 0 :(得分:1)

选项1是要走的路。对于选项2,设计更改或重新定位圆圈需要您重新对所有内容进行切片。