ハイパーリンク実装ブックマーク

ブックマークを実装するには、アンカーとは何かを理解する必要があります。錨とは、船に取り付けられた錨のことで、投錨した後は船が簡単に流されたり、迷ったりすることはありません。実際、アンカーは 1 ページ内の別の場所にジャンプするために使用され、ブックマークと呼ばれる場所もあります。もちろん、関連するタグは < a> タグです。ハイパーリンクタグの name 属性は、アンカーの名前を定義するために使用され、ハイパーリンクの href 属性は対応するアンカーにジャンプできます。名前に基づいたアンカー。次のようにジャンプを実装します:

<a href="#跳转目的地名称">跳转起始字符</a>
...
...
...
<a name="跳转目的地名称">跳转目的地字符</a>

詳細に実装してみましょう:

<html>
    <head>
    <title>HTML</title>  
    </head>  
<body style="font-size:20px">
    <p style="text-align:center">网页书签</p>
    <p>
    <a href="#c1">网页一</a>
    </p>
    <p>
    <a href="#c2">网页二</a>
    </p>
    <p>
    <a href="#c3">网页三</a>
    </p>
    <p>
    <a href="#c4">网页四</a>
    </p>
    <p>
    <a href="#c5">网页五</a>
    </p>
    <h1><a name="c1"></a>网页链接一</h1>
    <p>内容</p>
    <p>lalalaalalal</p>
    <p>lalalaalalal</p>
    <h1><a name="c2"></a>网页链接二</h1>
    <p>lalalaalalal</p>
    <p>内容</p>
    <p>lalalaalalal</p>
    <h1><a name="c3"></a>网页链接三</h1>
    <p>内容</p>
    <p>lalalaalalal</p>
    <p>lalalaalalal</p>
    <h1><a name="c4"></a>网页链接四</h1>
    <p>内容</p>
    <p>lalalaalalal</p>
    <p>lalalaalalal</p>
    <h1><a name="c5"></a>c网页链接五</h1>
    <p>lalalaalalal</p>
    <p>lalalaalalal</p>
    <p>内容</p>
    </body>
</html>

QQ截图20161206112015.png

クリックしてジャンプを実装します

学び続ける

新しいファイル

<html> <head> <title>HTML</title> </head> <body style="font-size:20px"> <p style="text-align:center">网页书签</p> <p> <a href="#c1">网页一</a> </p> <p> <a href="#c2">网页二</a> </p> <p> <a href="#c3">网页三</a> </p> <p> <a href="#c4">网页四</a> </p> <p> <a href="#c5">网页五</a> </p> <h1><a name="c1"></a>网页链接一</h1> <p>内容</p> <p>lalalaalalal</p> <p>lalalaalalal</p> <h1><a name="c2"></a>网页链接二</h1> <p>lalalaalalal</p> <p>内容</p> <p>lalalaalalal</p> <h1><a name="c3"></a>网页链接三</h1> <p>内容</p> <p>lalalaalalal</p> <p>lalalaalalal</p> <h1><a name="c4"></a>网页链接四</h1> <p>内容</p> <p>lalalaalalal</p> <p>lalalaalalal</p> <h1><a name="c5"></a>c网页链接五</h1> <p>lalalaalalal</p> <p>lalalaalalal</p> <p>内容</p> </body> </html>

リセットコード

自動運転

提出する

プレビュー Clear