Html 选项卡信息显示为正文中各节的链接

我试图在我身体的某个部分中创建选项卡，但它并没有显示为选项卡，而只是指向文本部分的链接

<div class="tabs">
   <ul id="tabsnav" data-tab>
    <li class="selected"><a href="#tab-1">Tab One</a></li>
    <li><a href="#tab-2">Tab Two</a></li>
    <li><a href="#tab-3">Tab Three</a></li>
    <li><a href="#tab-4">Tab Four</a></li>
   </ul>
</div>

<div id="tab-1">
   <p> tab 1</p>
</div>

<div id="tab-2">
   <p> tab 2.</p>
</div>

<div id="tab-3">
   <p> tab 3.</p>
</div>

<div id="tab-4">
   <p> tab 4.</p>
</div>

---

我不熟悉标签，所以如果有人能给我一些提示，告诉我如何让标签一次只显示一个标签，我将不胜感激。

我相信您需要在CSS中使用：target选择器

所以您只想在标签1上显示文本1，在标签2上显示文本2，等等？或者你到底在找什么？你在哪里找到这个代码的？这看起来像jQueryUI选项卡。如果它显示为链接，可能您缺少了一些参考资料？tsHunter:是的，这就是我所希望的。Salazar:从基本帮助教程中找到的。不记得名字了。我想是的，但我不知道那些参考资料是什么。希望这里有人知道。

div.tabs #tabsnav {
list-style-type: none;
float: left;
text-align: left;
margin: 60px;
background: #000000;
width:300px;
}

div.tabs #tabsnav li{
display: inline;
}