![赤丸先生](https://amuos1210.yurushoku.com/wp-content/uploads/2020/06/赤丸先生.png)
赤丸先生
今回は、目次を作る方法だよ。
ついでに、周りに二重線もつけてみるよ。
いいね。
![青丸くん](https://amuos1210.yurushoku.com/wp-content/uploads/2020/06/青丸くん.png)
青丸くん
![赤丸先生](https://amuos1210.yurushoku.com/wp-content/uploads/2020/06/赤丸先生.png)
赤丸先生
じゃあ、まずは、プレビューを見よう!
リンクをクリックすると、上の方に画面が移動するよ。
目次
赤丸先生の会話![赤丸先生](https://amuos1210.yurushoku.com/wp-content/uploads/2020/06/赤丸先生.png)
赤丸先生
こんな感じなものを作るよ。
さっきのコードは、
<style>
.border{
border:double;
}
</style>
<div class="border">
<h2>目次</h2>
<a href="#1">赤丸先生の会話</a>
</div>
です。ワープすると、移動する場所のプログラムも必要です。
なので、<p id=”1″>こんにちは</p>
こうすると、こんにちはの文字にワープするようになります。
<style>
.border{
border:double;
}
</style>
<div class="border">
<h2>目次</h2>
<a href="#リンクする番号">リンクの文字</a>
</div>
リンクする番号とは、<p id=””>のidの文字のことです。「#」も忘れずに。
説明がちょっと難しいので、コメントで質問してください。
小3なので許してくださいw
![2人](https://amuos1210.yurushoku.com/wp-content/uploads/2020/06/2人.png)
2人
ばいばーい