html - HTML / CSS - 箭头在轮播下方

Question

嗨，我是初学者，我的网页轮播需要一些帮助。我做了 2 个箭头，左箭头在旋转木马下方。我怎样才能把它移到前面？谢谢你。在此处输入图像描述

HTML

<button class="btn left-btn hide">
            <img src="img/left-arrow.svg" alt="">
        </button>

CSS

.left-btn {
    left: 25px;
}

标签： htmlcssposition

Answer 1

使用 z-index 将元素向前移动。例如，您可以设置一个大的 z-index 以使左箭头向前：

.left-btn {
    left: 25px;
    z-index: 999;
}

“z-index 属性指定元素的堆栈顺序。

具有较大堆栈顺序的元素始终位于具有较低堆栈顺序的元素之前。”

引自：https ://www.w3schools.com/cssref/pr_pos_z-index.asp