Question

我的html主体如下：

<body>
<div class="container">
<ul class="tabs">
    <li><a href="#tab1">Description</a></li>
    <li><a href="#tab2">Specs</a></li>
</ul>
<div class="pane">
    <div id="tab1">
        <h2>Hello</h2>
        <p>Hello hello hello.</p>
        <p>Goodbye goodbye, goodbye</p>
    </div>
    <div id="tab2" style="display:none;">
        <h2>Hello2</h2>
        <p>Hello2 hello2 hello2.</p>
        <p>Goodbye2 goodbye2, goodbye2</p>
    </div>
</div>
<div class="content">This should really appear on a new line.</div>
</div> 
</div>
</body>

，头部如下：

<head>

<meta charset="utf-8">
<title>Edysis</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0">
      <link rel="stylesheet" href="/static/css/jquery-ui.css">
      <script src="/static/js/jquery-1.9.1.js"></script>
      <script src="/static/js/jquery-ui.js"></script>
      <script>
      $(document).ready(function() {
        $("ul.tabs a").click(function() {
             $(".pane div").hide();
              $($(this).attr("href")).show();
         });
      })
      </script>

<link href="http://themeclue.com/css/style.css" rel="stylesheet" media="screen">
<link href="http://fonts.googleapis.com/css?family=Cabin:400,500,600,700|Asap:400,700" rel="stylesheet" type="text/css">
<script type="text/javascript">

</script>
<div class="navbar">
<div class="navbar-inner">
<div class="container">
<h1>Edysis</h1>
<div class="nav-collapse collapse">
<ul class="nav">
<li>
<a href="home">HOME</a>
</li>
<li>
<a href="free-themes">CALENDER</a>
</li>
<li>
<a href="new-themes">DEGREE PROGRAMS</a>
</li>
<li>
<a href="popular">ADVISING</a>
</li>
<li>
<a href="signin">SIGN IN</a>
</li>
<li>
<a href="signup">SIGN UP</a>
</li>
</ul>
</div> 
</div> 
</div> 
</div> 
</head>

除了标签效果似乎不起作用外，一切看起来都很好。我在这里试过this example。请告诉我错误的位置。

Answer 1

您可以先将以下html放在<head></head>

中

   ` <div class="navbar">
<div class="navbar-inner">
<div class="container">
<h1>Edysis</h1>
<div class="nav-collapse collapse">
<ul class="nav">
<li>
...
</div> 
</div> `

在<body></body>

内

您所关注的示例直接在li内部需要一个锚标记，该ul是具有class='tabs'的{{1}}的孩子

您确定要关注该教程或其他内容吗？！

html正文中的选项卡菜单错误

1 个答案: