投稿記事に目次をつけてページ内ジャンプをさせるとページ上部のMENU画面に、リンク先の文字が隠れてしまい表示不良を起こす場合があります。このような時には、CSSコードを使いジャンプ先にマージンを加える事で問題が解消されます。その時に使えるCSSとHTMLコードです。簡単なので是非お試し下さい。

ページ内リンクで使う標準HTML CODE

ジャンプ先：

<a id="name"></a>

リンク箇所：

<a href="#name"></a>

ジャンプ先の文字が隠れる場合のCSS CODEとHTML CODE

ページ上部に固定されたメニューがある場合、ジャンプ先の文字が、メニューに隠れて表示されない現象が起きる場合があります。
この場合、ジャンプ先の上部に隙間を作る必要があります。その場合の手順は以下の通りです。

1.CSSコードを追記

a.anchor{
    display: block;
    padding-top: 70px;
    margin-top: -70px;
}

2.ジャンプ先HTMLコードを記入

<a id="name" class="anchor"></a>

3.リンク箇所HTMLコードを記入

<a href="#name"></a>

是非お試し下さい。

以上