相对于同一页面上另一个元素的位置,我应该如何将元素绝对放置在页面上?我已经使用 css“position:center;”将 jpg 居中,现在我想使我放置在 jpg 和整个页面周围的元素偏离中心一定数量的像素,相对于那个 jpg。
最佳答案
位置:居中;不是有效代码,使用 margin: 0 auto;
您必须将背景图像设置为 position: relative;以及该背景图像的所有其他内容。参见 fiddle 。
.my-image {
margin: 0 auto;
position: relative;
width: 256px;
height: 256px;
background-image: url('http://ocmapdb.wdfiles.com/local--files/mapper:shadowsand/White%20Tiger%20Head.jpg');
background-repeat: no-repeat;
}
这是背景图像的图像位置。
.image-two {
position: absolute;
top: 100px;
left: 50px;
}
HTML
<div class="my-image">
<img class="image-two" src="http://www.iconshock.com/img_jpg/SUPERVISTA/animals/jpg/256/tiger_icon.jpg">
</div>
关于css - 相对于中心定位页面元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25333904/