背景图片<ul> list，css </ul>

Question

这是我的代码：

    #jackpots {
    position: relative;
    width: 228px;
    min-height: 30px;
    background: url(images/pattern.png) repeat;
    }

    .bottomImage {
    position: absolute;
    bottom: 0; 
    z-index: 1;
    }

    #jackpots ul {
    z-index: 2;
    }

HTML：

    <div id="jackpots>
        <ul>
            <li>...</li>
            <li>...</li>
            <li>...</li>
            <li>...</li>
        </ul>
    <img src"some.jpg" class="bottomImage">
    </div>

问题是：li元素只有在它们下面没有图像时才可以点击。 我已尝试使用更大的z-index数字，以防我的整个代码中已经有1或2，没有运气。

Answer 1

您需要更改CSS：

#jackpots ul {
    position: relative;
    z-index: 2;
}

将position值更改为relative将允许z-index影响堆叠顺序，这就是您想要的。