Navbar元素

Question

我已经做了一个导航条与4个元素(主页，约，项目，联系)。每个元素都是带有self id的锚标记。我希望通过单击元素分别继续进行部分，但我不希望我的url像#关于或#contact

这是我的密码：

<ul>
      <li>
           <a href="/">Home</a>
      </li>

      <li>
            <a href="#about">About</a>
       </li>

       <li>
            <a href="#services">Services</a>
       </li>

       <li>
           <a href="#contact">Contact</a>
       </li>

 </ul>

Answer 1

您不能在纯HTML中这样做，但是您可以在Javascript中实现类似的东西。

就像这样，将部分滚动到视图中：

<ul>
      <li>
           <a href="/">Home</a>
      </li>

      <li>
            <a onclick="document.getElementById('about').scrollIntoView()">About</a>
       </li>

       <li>
            <a onclick="document.getElementById('services').scrollIntoView()">Services</a>
       </li>

       <li>
           <a onclick="document.getElementById('contact').scrollIntoView()">Contact</a>
       </li>

 </ul>

或者最好定义一个可以像这样快速调用的函数：

<ul>
      <li>
           <a href="/">Home</a>
      </li>

      <li>
            <a onclick="scrollforme('about')">About</a>
       </li>

       <li>
            <a onclick="scrollforme('services')">Services</a>
       </li>

       <li>
           <a onclick="scrollforme('contact')">Contact</a>
       </li>

 </ul>

    
<script>
function scrollforme(sectionid){
    document.getElementById(sectionid).scrollIntoView();
}
</script>