相対的に配置されている要素のhtmlのアンカーにスクロールできますか？

Question

私はこのHTMLを持っている：

 <li name="services"> 
      <h1>Services</h1> 
      <p>text</p> 
     </li> 
     <li name="about"> 
      <h1>About</h1> 
      <p>text</p> 
     </li> 
     <li name="portfolio"> 
      <h1>Portfolio</h1> 
      <p>text</p> 
     </li> 
     <li name="team"> 
      <h1>Team</h1> 
      <p>text</p> 
     </li> 
     <li name="process"> 
      <h1>Process</h1> 
      <p>text</p> 
     </li> 
     <li name="packages"> 
      <h1>Packages</h1> 
      <p>text</p> 
     </li> 
    </div> 

このHTMLページ上の比較的位置です。私がページを '#services'に向けると、絶対に何もしません。ページを再びロードするだけです。私は、問題が比較的ポジティブであると仮定しています。この仕事をする方法はありますか？

Answer 1

ページを '#services'にすると、全く何もありません。

私は相対的な配置が問題だとは思わない。フラグメント識別子（ハッシュ）は、idの値がハッシュと一致する要素、またはnameがタグと等しいa name=要素（アンカーであることに注意してください。aタグで、タグだけではありません）。 liタグがこれらのいずれの基準とも一致しません。 （実際には、私はli elementsがname属性を持つことが許されていることを信じていません。）

この構造は、ページ上で一意である場合は、

<li id="services"> 

に

<li name="services"> 

を変更してみてくださいLive example

何年もの間、それはよく知られた秘密でした（私は確かにそれについて知らなかった年）が、はcovered in the HTML 4.10 specであった。

Answer 2

あなたがアンカー<a>タグを使用する必要があります。

<a name="services"></a> 

Answer 3

あなたはname要素とaタグを作成する必要があります - あなただけの任意のタグ

<li><a name="packages"></a> 
    <h1>Packages</h1> 
    <p>text</p> 
</li>