我在div中有一个大小为300px的图像,我想要在图像两侧的下一个和上一个箭头。然而,增加的一个问题是,如果屏幕是300px,我希望箭头位于图像的顶部。怎么办呢?
我的div代码如下:
<!--this div is the container for the carousel -->
<div id='mySwipe' style='max-width:300px; margin:0 auto' class='swipe'>
<!--the images are in this div -->
<div class='swipe-wrap'id="featured">
</div>
</div>
答案 0 :(得分:2)
.container { position: relative; }
.container .arrow { position: absolute; top: 150px; }
.container .arrow.left { left: 0; }
.container .arrow.right { right: 0; }
通过设置父级的相对定位(默认为static
)和子级的绝对定位,它们将是相对于父级的绝对位置。