Question

我希望像this picture

这样的标签面板

我想在ASP.NET选项卡面板上实现相同的功能。但是，如果我得到CSS，我会使它与ASP.NET选项卡兼容。

任何人都可以指导我如何做到这一点，或教程参考。因为我不知道这个选项卡面板CSS被称为什么。

Answer 1

不确定我完全理解你想要的东西（我不知道ASP）。

但据我了解，您可以使用jQuery UI tabs并自定义其CSS。

示例：

<强> HTML

<div id="tabs">
    <ul>
        <li><a href="#tabs-1">Nunc tincidunt</a></li>
        <li><a href="#tabs-2">Proin dolor</a></li>
        <li><a href="#tabs-3">Aenean lacinia</a></li>
    </ul>
    <div id="tabs-1">
        <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, risus.</p>
    </div>
    <div id="tabs-2">
        <p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc.</p>
    </div>
    <div id="tabs-3">
        <p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti.</p>
    </div>
</div>

<强> jQuery的：

$(function() {
    $( "#tabs" ).tabs();
});

Answer 2

实施起来很棘手。仅从CSS的角度讲，您需要将标签实现为

元素。实施例

<ul>
<li>tab1<li>
<li>tab2</li>
...
</ul>

设计的其余部分只是CSS。由于你有tringular标签，所以你需要背景图像。

Tab面板的CSS

2 个答案: