寻找一些关于如何在 html/css 中实现以下设计的提示和技巧:
蜡烛是图像。绿色背景是包含其他元素的 div 的平铺背景,而粉红色背景是整个页面的背景。
如何放置蜡烛图像,使其大部分位于带有绿色 bg 的 div 内,然后火焰的小突出部分的 bg 为粉红色图案?请注意,粉红色图案是整个页面的背景。
绿色图像
最佳答案
我会将蜡烛制作成透明的 PNG 文件,这样我就不必费心构建蜡烛图像,使背景图像的条纹和点正确对齐。
如果您使用 alpha 透明度,这可能会在 IE6 中产生问题,但有解决方法。
然后我将蜡烛放在带有 float: left
或 position: absolute
的容器中(取决于布局的其余部分),位于左侧绿色区域的一侧。
图像本身将获得 position: relative; top:-50px
(相应地调整)以向上移动到内容容器之外。
关于html - 如何布局跨越两个不同背景图像的图像的方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6088986/