ページ内リンクについて
ページ内リンクを設置する上の注意点
ページ内リンクは、通常の方法ではうまく位置を取得できなかったので、特殊な方法を採用しております。通常のページ内リンクの方法もご利用可能ではありますが、位置がずれる場合があります。
この特殊な方法でページ内リンクすると、リンク先が同一ページであっても、一度ページのトップに戻ってから(ページが再読み込みされてから)、スムーススクロールで指定の場所に移動します。
ページ内リンクの設置方法
ページ内リンクの設置方法は通常、HTMLファイルにて、
<a href="#name">リンク先へ</a>
というように記述しますが、このHTML5テンプレート No.006に限り、
<a href="?id=name">リンク先へ</a>
というように『#』の代わりに『?id=』を記述します。
リンク先(移動先)は、こちらは特に変更はなく、
<div id="name">ここにジャンプします</div>
というように記述します。
サンプルタグについて
以下、サンプルタグになります。ご利用の際は参考にしてみてください。
h2タグ
h3タグ
h4タグ
h5タグ
h6タグ
強調(em)
より強い強調(strong)
追加(ins)
削除(del)
テキストアンカー
引用部分です。引用部分です。引用部分です。引用部分です。引用部分です。引用部分です。引用部分です。引用部分です。引用部分です。引用部分です。引用部分です。引用部分です。
リスト
普通のリスト
- 普通のリスト1
- 普通のリスト2
- 普通のリスト3
番号付きリスト
- 番号付きリスト1
- 番号付きリスト2
- 番号付きリスト3
li要素の中はブロックレベルのタグを使用することが出来ます。例えば、<p>タグも記述することが出来ます。
デザインリスト
このようにリストマークをチェックマークにしたい場合は、ulタグに『class="list"』を追記してください。
- デザインリスト1
- デザインリスト2
- デザインリスト3
li要素の中はブロックレベルのタグを使用することが出来ます。例えば、<p>タグも記述することが出来ます。
定義リスト
- 定義リスト1
- 定義した用語の説明
- 定義リスト2
- 定義した用語の説明
- 定義リスト3
- 定義した用語の説明
dd要素の中はブロックレベルのタグを使用することが出来ます。例えば、<p>タグも記述することが出来ます。しかし、dt要素にはインライン要素しか記述することができません。
テーブル
見出し1 | 見出し2 | 見出し3 | 見出し4 | 見出し5 |
---|---|---|---|---|
セル1 | セル2 | セル3 | セル4 | セル5 |
セル1 | セル2 | セル3 | セル4 | セル5 |
セル1 | セル2 | セル3 | セル4 | セル5 |
見出し1 | セル1 | セル2 | セル3 | セル4 | セル5 |
---|---|---|---|---|---|
見出し2 | セル1 | セル2 | セル3 | セル4 | セル5 |
見出し3 | セル1 | セル2 | セル3 | セル4 | セル5 |
見出し4 | セル1 | セル2 | セル3 | セル4 | セル5 |
見出し5 | セル1 | セル2 | セル3 | セル4 | セル5 |