我知道他们有很多类似的问题,但没有解决我的问题。如何将图像放在x px间隙的另一个下面?这是我的代码
html
<img src="images/2.jpg" style="position:absolute;">
<img src="images/1.png" style="position:absolute;">
CSS
img {
top: 50%;
left: 50%;
max-width: 480px;
width: 100%;
height: auto;
transform: translate(-50%, -50%);
display: block;
}
修改:这是我的问题https://jsfiddle.net/50crfe10/ 如您所见,它们是2张图像,但只有1张图像出现。因为一个人在另一个人之上。
答案 0 :(得分:0)
只需删除位置:绝对如果你的确定,并删除转换属性
img {
max-width: 480px;
width: 100%;
height: auto;
display: block;
margin:20px auto;
}
&#13;
<body>
<img class="one" src="https://scontent-sin.xx.fbcdn.net/v/t1.0-0/s480x480/13432215_784505675021945_898862369521210510_n.png?oh=1600b007c6bc56ad2a9e72c5978166b5&oe=5802FEB3">
<img class="two" src="https://scontent-sin.xx.fbcdn.net/v/t1.0-9/13423946_783982808407565_3306592852780950589_n.png?oh=1131478aac319f301c563d020ed8214e&oe=57C2C4DE">
</body>
&#13;