Javascript 单页网站锚名称链接到页面顶部不会转到页面顶部_Javascript_Html_Css

Javascript 单页网站锚名称链接到页面顶部不会转到页面顶部

javascript html css

Javascript 单页网站锚名称链接到页面顶部不会转到页面顶部,javascript,html,css,Javascript,Html,Css,我有一个简单的单页网站，有一些带有命名链接的导航。其中一个链接指向id为“home”的div，该div位于body标记的右下方。此链接的目标是返回到页面顶部，但是，当选中此链接时，页面将返回到略低于页面顶部的位置（例如，要求您稍微向上滚动）在Chrome、Firefox和Safari上证实了这一点。如果没有javascript，这是不可能的吗？仅供参考：我使用JSFIDLE进行了尝试，但没有出现问题以下是html： <html> <head> <li

我有一个简单的单页网站，有一些带有命名链接的导航。其中一个链接指向id为“home”的div，该div位于body标记的右下方。此链接的目标是返回到页面顶部，但是，当选中此链接时，页面将返回到略低于页面顶部的位置（例如，要求您稍微向上滚动）

在Chrome、Firefox和Safari上证实了这一点。如果没有javascript，这是不可能的吗？仅供参考：我使用JSFIDLE进行了尝试，但没有出现问题

以下是html：

<html>
  <head>
    <link rel="stylesheet" type="text/css" href="main.css">
      <link href='http://fonts.googleapis.com/css?family=Cantata+One' rel='stylesheet' type='text/css'>
    </head>

<body>
    <div id="home">
        <div id="nav">
     <ul>
         <li><a href="#home">Home</a></li>
         <li><a href="#experiments">Experiments</a></li>
         <li><a href="#contact">Contact</a></li>
     </ul>
    </div>
        <h1>
          <span id="i">i</span> 
          <span id="n">n</span>
          <span id="c">c</span>
        </h1>
      <h2>
          <span id="tagline">"angel investor, coder want-to-be, nikola tesla groupie."</span>
    </h2>
</div>

<div id="experiments">
      <span id="ex">ex</span>   
          <span id="amples">amples</span>
    </div>
</body>

在洞口主体标记后面使用命名锚定

<body> <a name="top"></a>

然后重定向到#top，它会弹出。否则，您必须使用js。

在开始正文标记之后使用命名锚定

<body> <a name="top"></a>

然后重定向到#top，它会弹出。否则，您必须使用js。

而不是显式设置#home的高度，请尝试使用overflow:auto

#home{
    overflow: auto;
}

与其显式设置#home的高度，不如尝试使用overflow:auto

#home{
    overflow: auto;
}

我很感激，但这并没有解决问题。我很感激，但这并没有解决问题。