css - 使用CSS使两个透明图像重叠

标签 css image transparency overlap

我正在尝试使两个透明图像(具有相同的大小/尺寸)在其左上角的 div 内重叠。我试过:

<html xmlns="http://www.w3.org/1999/xhtml">
<body>
<div style="margin:20px;">
<div id="main" style="overflow:hidden;background-color:red;width:400px;height:400px;border:3px solid blue;">
<img src="myimage1.png" style="position:relative;top:0px;left:0px;z-index:0;"/>
<img src="myimage2.png" style="position:relative;top:0px;left:0px;z-index:10;"/>
</div>
</div>
</body>
</html>

但这行不通。相反,两张图片在父 div 中串联。

最佳答案

尝试制作#mainposition:relative , 然后改变两个 <img>的使用 position:absolute .

关于css - 使用CSS使两个透明图像重叠,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2575024/

相关文章:

javascript - 在 CSS 动画完成后删除类 - jQuery

html - 在 CSS 标签后使用 HTML 实现悬停状态

java - 骨骼动画工具编程

html - 使横幅图像的某些区域可点击

c# - 如何使用 Mono 在 GTK# TextView 中设置透明背景?

css - 样式栏文本类型属性

html - translateX 覆盖 translateY

iPhone键盘透明度

pdf - 将 pdf 文件转换为 tiff 文件的最佳方法

android - 是否可以在 Android 中设置 View 的透明度?