Question

我无法从一些nav列表链接到一些h2标题。

当我单击文档中的导航栏时，我希望它跳到页面中的正确标题。这是我的代码：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Wisconsin Colleges and Universities</title>
    <script src="modernizr-1.5.js"></script>
    <link href="hestyles.css" rel="stylesheet" type="text/css" />
    <base href="url" target="collegeWin"/>
  </head>

   <body>

      <header>
         <img src="highered.jpg" alt="Higher Education" />
      </header>

      <section> 

         <h1>Wisconsin Colleges and Universities</h1>

         <nav>
            <ul>
               <li><a href="#private">Private Colleges and Universities</a></li>
               <li><a href="#technical">Technical College System</a></li>
               <li><a>University of Wisconsin System</a></li>
            </ul>
         </nav>

         <h2 id="private">Private Colleges and Universities</h2>
         <ul>
            <li><a href="http://www.alverno.edu">Alverno College</a></li>
            <!-- ... -->
            <li><a href="http://www.wlc.edu">Wisconsin Lutheran College</a></li>
         </ul>

         <h2 id="technical">Technical College System</h2>
         <ul>
            <li><a href="http://www.blackhawk.edu">Blackhawk Technical College</a></li>
            <!-- ... -->
            <li><a href="http://www.witc.edu">Wisconsin Indianhead Technical College</a></li>
         </ul>

         <h2 id="public">University of Wisconsin System</h2>
         <ul>
            <li><a href="http://www.uwgb.edu">UW-Green Bay</a></li>
            <!-- ... -->
            <li><a href="http://www.uww.edu">UW-Whitewater</a></li>
         </ul>

         <footer>
            Higher &#9830; Ed: The Directory of Higher Education Opportunities
         </footer>
      </section>
   </body>
</html>

正如您所看到的，我已将ID放在h2标头上，并尝试使用# - 前缀片段ID链接到它们。但由于某种原因，我收到一条错误消息，指出“无法找到。请确保路径或Internet地址正确。”

Answer 1

这是因为您有一个标签base。删除它，它会工作。见https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base

Answer 2

试试这个

 <li><a href="#private" target="_self">Private Colleges and Universities</a></li>
 <li><a href="#technical" target="_self">Technical College System</a></li>
 <li><a href="#public" target="_self">University of Wisconsin System</a></li>
 </ul>

链接导航列表和标题

2 个答案: