CSS设计和图像
CSS设计和图像
提问于 2012-10-20 03:27:35
我有下面的链接：
http://www.noupe.com/
如果你看左上角的花朵，你会发现这种风格经常被使用。这是使用下面这样的方法完成的吗？
<div> upper flower part image </div>
<div> lower flower part image</div>或者使用z-index？
具体来说，在代码读取<div id="header" > </div>的位置附近，这显示了花朵的底部，上面的某个地方显示了花朵的上部
是否对图像进行了切片以创建该效果？
有没有简单的例子来突出这种效果？
回答 2
Stack Overflow用户
回答已采纳
发布于 2012-10-20 03:32:51
是的，图像被分成多个部分，然后在容器上设置为背景图像……
你可以在这里看到其中一片...
http://www.noupe.com/wp-content/themes/noupe/images/decor-1.png
这是用来实现这一点的CSS。
#main .decor-1 {
background: url(http://www.noupe.com/wp-content/themes/noupe/images/decor-1.png) no-repeat;
width: 584px;
height: 211px;
position: absolute;
left: -97px;
top: -123px;
}Stack Overflow用户
发布于 2012-10-20 03:30:50
看看它的来源。他们使用非语义类，如decor-1，其背景图像绝对位于站点的其余部分。
#main .decor-1 {
background: url(image) no-repeat;
width: 584px;
height: 211px;
position: absolute;
left: -97px;
top: -123px;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/12981132
复制相关文章
相似问题
腾讯云开发者
