There are plenty of tutorials online for creating tabbed panels in HTML documents, some using JavaScript, some using pure CSS tricks. Most of the approaches seem to assume that a list of some type is the appropriate element to use for a tabbed interface, but I'd argue that lists are not semantically descriptive of tabbed interfaces. They either include the main tab content along with the tab name, like so: <ul class="tabs"> <li class="tab-active"><a href="">Active</a> Active tab content goes here</li> <li><a href="">Second</a> Inactive second tab content goes here</li> <li><a href="">Third</a></li> </ul> Or the tab content has no semantic relationship with the tabs that control their display, like: <ul class="tabs"> <li class="tab-active"><a href="#first">Active</a></li> ...