Question

I want to have Tab panel like this picture

I want to implement the same on ASP.NET tab panel. However, if I get the CSS I would make it compatible to ASP.NET tab.

Can anyone please guide me how to do that, or tutorial reference. Because I don’t know that what this tab panel CSS known as.

Answer 1

Not sure I understand completely what you want (I don’t know ASP).

But from what I understand, you can use jQuery UI tabs and customize its CSS.

Example:

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();
});