web制作！初級編 HTMLで最初に知っておくべきタグを紹介します！
HTMLのタグの使い分けは、ブラウザーにページの構造や内容を伝えるために使用されますので重要です。
しかし、最初からすべてを覚える必要はなく、一部のタグを使い分けることができればサイトは作成できます。
簡単なものから覚えていきましょ～！！
よく使用するタグ
- <section>:ページ内のメインコンテンツを区切る場合やコンテンツをグループ化するときに使います。
- <h1>、<h6>:見出しを定義します。h1が最も大きな見出しで、h6が最も小さい見出し
- <p>:段落を定義します。
- <a>:ハイパーリンクを定義、URLなどリンクの設定
- <img>:画像を表示
- <ul>:番号なしリストを定義
- <ol>:番号付きリストを定義
- <li>:リスト項目を定義、ul、liの中に記述する。
section～liの書き方(サンプル)
<section>
<h1>ここに見出しを入れる</h1>
<p>ここにテキストを入れていく</p>
<ul>
<li>ulは番号がないリスト</li>
<li>olは1,2,3などの番号があるリスト</li>
<li>liはリストの中で使用するタグ</li>
</ul>
</section>
aタグ、imgタグの書き方(サンプル)
imgタグのsrcにパスを入力、altに画像が表示されなかった場合の画像の名前を入れる。
りんごの画像なら「りんご」と入力。
aタグはリンクの設定をする際に使用します。内部リンクと外部リンクがあることを覚えておきましょう！！
<section>
<h1>ここに見出しを入れる</h1>
<img src="img/title-back.png" alt="りんご">
<a href="https://punitama-blog.com/" target="_blank" rel="noopener">ここをクリックするとぷにたまブログのトップに移動するよ（外部リンク）</a>
<a href="index.html">ここをクリックすると同じ階層のindex.htmlに移動するよ（内部リンク）</a>
</section>
まとめ
今回はタグの紹介、説明をしました。
詳しい解説は実際にコード書きながら学んでいきましょう！！
簡単な説明をしましたので、次回はコードを書く準備をしていきます。
Visual Studio Codeのインストール、使用するプラグインを紹介します。
コメント