我需要把标签放在页面上--总是放在页面的前面

Question

需要将选项卡放在页面上--始终放在页面的前面。如果你点击1，2，这是很好的，但当你点击3，页面滚动出现在标签上方。我怎样才能保留前面的标签呢？

这是我的jsfiddle链接http://jsfiddle.net/97tbk/737/

以下是代码

<div id="tabs">
    <ul>
        <li><a href="#fragment-1"><span>One</span></a></li>
        <li><a href="#fragment-2"><span>Two</span></a></li>
        <li><a href="#fullpage"><span>Three</span></a></li>
    </ul>

    <div id="fragment-1">
        <p>First tab is active by default:</p>
        <pre><code>$( "#tabs" ).tabs(); </code></pre>
    </div>

    <div id="fragment-2">
        Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
    </div>

    <div id="fullpage">
        <div class="section">One</div>
        <div class="section">
            <div class="slide">Two 1</div>
            <div class="slide">Two 2</div>
        </div>
        <div class="section">Three</div>
        <div class="section">Four</div>
    </div>
</div>

Answer 1

您需要向无序列表中添加一个z索引。试试这个：

ul {
    z-index: 9999;
    position: relative;
}

我现在不能测试这个代码片段，但我非常确定它可以工作。

Answer 2

为此，您可以使用"z-index“属性。你必须将always与"position: relative“一起使用，否则它将不起作用。

#tabs ul {
    position: relative;
    z-index: 99;
}

这里是小提琴：http://jsfiddle.net/97tbk/740/