asp.net - asp.net 中的 css 垂直制表符

Question

我想要一个使用 css 的垂直选项卡菜单，它看起来像 ajax 控件工具包选项卡容器。请参阅 second example in the link . 我需要使用 css 来实现这一点，而不必使用 ajax 控制工具包。

Answer 1

您可以查看它生成的 CSS 并制作一个 jQuery 脚本来控制状态，如下所示:

$(document).ready(function() {       
    var tabs = $('div.tabs > div');
    tabs.hide().filter(':first').show();

    $('ul.tab_nav li a').click(function() {
        tabs.hide();
        tabs.filter(this.hash).show();
        $('ul.tab_nav li a').parent().removeClass('selected');
        $(this).parent().addClass('selected');
        return false;
    }).filter(':first').click();
}

使用一些 HTML，例如:

<ul class="tab_nav">
    <li><a href="#tab-1">Tab 1</a></li>
    <li><a href="#tab-2">Tab 2</a></li>
</ul>
<div class="tabs">
    <div id="tab-1">
        Tab 1
    </div>
    <div id="tab-2">
        Tab 2
    </div>
</div>