【サンプルあり】Markdownでページ内リンクの書き方(はてなのMarkdown対応)
Markdownでページ内リンク(アンカーリンク)の書き方
忘れた頃にMarkdownでいつもページ内リンクを書きたくなるので、こちらに書き残しておくことにした。
なお、このはてなブログ内でも正常に動くことを確認している。
(もちろんプレビューでも動く)
Markdownでのページ内リンクの書き方
下記のように#を使って設定したアンカーに飛ばすようにする
[midashiにとぶ](#midashi)
アンカー自体の書き方は下記のように id 属性を用いて記載する
(検索結果を見てみると name属性で設定する例も書かれているが、これは現在は非推奨なので利用しない。詳細については こちら に書いた
<a id="midashi"></a> midashi
具体例
では、実際に上に書いた例をこのページ内に書いてみる。
ここでは下記のようにmarkdownを記述している。
[midashiにとぶ](#midashi) ・ ・ ・ <a id="midashi"></a> ## midashi
実際にHTMLに描画されたものが下になる。
(この下の midashiにとぶ というリンクを踏むと、midashi という位置に画面が移動するのがわかる)
・
・
・
midashi
ちなみにこの #midashi のところは日本語で #みだし でも問題なく動く。
・
・
・
みだし
使い方は以上となる。
aタグのname属性はHTML5で廃止されたのでアンカーとしては利用しない
ページ内のリンク先の場所を定義するアンカーとして以前は name 属性がよく利用されたようだが、これはHTML5では廃止になっているので利用しないようにする。
(現在もGoogleで検索するとアンカーとして name 属性を用いた記述も目にするが、現在は name ではなく id を利用することが推奨されている)
