html – 默认值：目标与CSS

概述我有这个CSS： <style type="text/css">.tab { display: none;}.tab:target { display: block;}</style> 而这个HTML： <div class="tab_container"> <ul class="tabs"> <li><a href="#updates-list">List</a> 我有这个CSS：

<style type="text/CSS">.tab {  display: none;}.tab:target {  display: block;}</style>

而这个HTML：

<div >  <ul >    <li><a href="#updates-List">List</a></li>    <li><a href="#updates-map">Map</a></li>  </ul>  <ul  ID="updates-List">    Eh.. Hello!  </ul>  <div  ID="updates-map"></div></div>

但是，如果没有指定目标(URL中的#)，并且还没有单击任何选项卡，我的页面是空的。我想默认显示ul#updates-List。

我该怎么做？谢谢。

更新：在此之前，如果不是初始目标，我的Google地图已损坏。有谁知道修复？

解决方法 自发地，我不得不说，我唯一可以想到的解决方案是不幸的是使用JavaScript。就像是：

<script type="text/JavaScript">  if (document.location.hash == "" || document.location.hash == "#")    document.location.hash = "#updates-List";</script>

编辑：

好的，得到了​​一个CSS解决方案。然而，这需要默认条目#updates-List放置在最后(#更新地图和您可能添加的任何其他选项卡)之后：

.tab,.tab:target ~ #updates-List  {  display: none;}#updates-List,.tab:target {  display: block;}

总结

以上是内存溢出为你收集整理的html – 默认值：目标与CSS全部内容，希望文章能够帮你解决html – 默认值：目标与CSS所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。