HTMLで、よく使うタグを紹介します。
<body>の中に書く、具体的なものになるので
今回紹介するものは、覚えておくことをおすすめします。
- 「見出し」h1～h6
- 「段落」p
- 「画像」img
- 「リンク」a
- 「リスト」ul,ol,li
ここでは、簡単に紹介するにとどめますが
各リンク先に、詳しく解説した記事を用意しています。
はじめての方は、1度は見ておいてください。
見出し
本や新聞では、詳しく読まなくても、
だいたいの内容が分かるような「見出し」が作られています。
webページを作るときにも、同じように「見出し」を作ります。
その時に使用するのが、<h1>~<h6>という要素（タグ）になります。
書き方
<h1>大見出し</h1>
<h2>中見出し</h2>
<h3>小見出し</h3>段落
文章を構成する時の「段落」を意味します。
一般的に文章を書く時には、「段落」を付けますよね。
同じように、webページを書く時も、「段落」を付けることで
読みやすい文章を書くことができます。
書き方
<p>この間が1つの段落として認識されます。</p>
<p>適度に段落を付けると、読みやすい文章として表示されます。</p>画像
画像を挿入したい時に使用します。
企業のロゴや、イメージ写真などをwebページに表示することができます。
適度に画像を使用すると、
文字だけでは表現できないような、視覚的な効果が期待できます。
書き方
<img src="○○○" alt="○○○">リンク
文字や画像に、リンクを付けることができます。
本や新聞にはない、webページならではの魅力ですね。
書き方
<a href="○○○">ここに書いたものがリンクになる</a>リスト
箇条書きのような表現や、
ランキングのような表現をしたい時に使用します。
項目は<li>というもので表現します。
箇条書きリストの書き方
<ul>
<li>○○○</li>
<li>○○○</li>
<li>○○○</li>
</ul>ランキングリストの書き方
<ol>
<li>○○○</li>
<li>○○○</li>
<li>○○○</li>
</ol>まとめ
今回は使用頻度の多いタグを紹介紹介しました。
今回紹介したタグは
とってもよく使うので、学習を進めるうちに身につきます。
「あれ？なんのタグ使うんだっけ？」
そうなった時に、すぐ見返せるように
どこかにメモしておくなどして活用してみてください。
- <h1> ～<h6> 見出し 例、<h1>〇〇〇</h1>
- <p> 段落 例、<p>〇〇〇</p>
- <img> 画像 例、<img src="〇〇〇" alt="△△△">
- <a> リンク 例、<a href="〇〇〇">
- <ul> 箇条書きリスト 例、<ul><li>〇〇〇</li></ul>
- <ol> ランキングリスト 例、<ol><li>〇〇〇</li><ol>