Html CSS中的选项卡菜单-如何设置活动选项卡

所以我有一个用CSS编写的标签菜单。它可以正常工作，但有一个问题-在我单击其中一个选项卡之前，所有选项卡都不会处于活动状态。例如，我希望第一个标签在我加载主页时处于活动状态，这样我就可以阅读标签中的内容，而不需要点击它来阅读

HTML:

---

按如下方式修改代码：

.tabmenu>div:target>a, .tabmenu>div.current>a {
   background: white;
}

.tabmenu>div:target>div, .tabmenu>div.current>div {
   position: absolute;
   z-index: 1;
}

要使用javascript，最快的方法是使用jQuery库，方法是添加：

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>

在关闭

标记之前，请使用以下代码：

<script>
   jQuery(function($){
       $(".tabmenu").children("div").click(function(){
           $(".current").removeClass("current");
       });
   });
</script>

jQuery（函数（$）{
$（“.tabmenu”）.children（“div”）。单击（函数（）{
$（.current”）.removeClass（“current”）；
});
});

---

-已更新。

耶，谢谢！：）我添加了“.tabmenu>div.current>a”，但没有对“.tabmenu>div.current>div”执行相同的操作。谢谢好吧，但还有一件事。当我单击另一个选项卡时，当前选项卡的外观不会改变。我能做些什么呢？事实上，使用target作为标签并不好。一个有趣的方法是，对选项卡使用

标签
+隐藏
复选框
，然后添加类似
:checked+div
和
:checked~div
的内容来显示适当的内容。嗯，我可以稍后再试。现在，我能用我已有的代码做些什么呢？我认为除了使用javascript删除
current
类之外，你什么都做不了。
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>

<script>
   jQuery(function($){
       $(".tabmenu").children("div").click(function(){
           $(".current").removeClass("current");
       });
   });
</script>