初めに
9月中旬から仕事をしながらHTML/CSSの勉強を始めて2週間ほど経ったので自分が勉強している中で頻出しているタグをまとめてみました。
間違ってる所等あればどんどん教えてください。
また、マークダウンで文章を書くのが初めてなので読みづらい点もご了承ください。
HTMLの雛型として必須なタグ
- htmlタグ
- これがなきゃHTML文が始まらない必須タグ、文書がHTMLなんだと分からせるタグ
- headタグ
- ブラウザで表示されないhtml文書の決まり事とかを書くエリアを囲むタグ
- bodyタグ
- ブラウザで表示される文書を書くエリアを囲むタグ
- metaタグ
- headタグ内で色々な文書のルールを書くために使われるタグ、終了タグがいらない
bodyタグ内で使われるタグ
- h1~6タグ
- この文書は見出しだよというタグ、1じゃない数字から始めるのは原則ダメ、数字は順番通り
- pタグ
- このタグで囲むと文書が一つ下の段落で表示される、段落が違う文書だよというタグ
- divタグ
- 主にCSSの装飾の為にクラスが振られるタグ、タグ自体に意味はないがブロック要素のため、囲んだ文書はそれぞれ段落になる、flexboxでめっちゃ使う
- spanタグ
- divタグと同じようにこのタグ自体に特に意味はないがこれもCSSでの装飾でよく使われるタグ、divタグとの違いはインライン要素の為、改行しないので文中の一部の文字色を変えたりするのに使う
- aタグ
- タグで囲んだ文書にリンクを貼るのに使うタグ、href属性でリンク先を指定できる
- imgタグ
- 画像を貼るのに使うタグ、終了タグがない、hrefではなくsrc属性で貼りたい画像の場所をリンクする
- ul,liタグ
- ulタグで囲んだliタグがリストになるタグ、単純に箇条書きのリストとかによく使う、olタグという順序立てたリストを作るタグもあるが、個人的にはあまり見ない
- dl,dt,ddタグ
- 用語と用語の説明で使うタグ、dtで囲んだ所が用語説明今からやりまーすみたいな宣言、dlタグが用語、ddタグがdlに書いた用語の説明文になる
bodyタグ内のHTMLを読みやすく使うのに使うタグ
- headerタグ
- ページのヘッダー部分だよと分かってもらうタグ
- mainタグ
- ページのメイン部分だよと分かってもらうタグ
- footerタグ
- ページのフッター部分だよと分かってもらうタグ
- asideタグ
- 広告とかメニューとか直接コンテンツに関係のないものをここで書いてると分かってもらうタグ
- sectionタグ
- 文章のセクションを表すタグ、結構使いやすくて個人的にはmainタグの中でバンバン使う
終わりに
個人的に学習の中でよく使っていて忘れないための備忘録の面が強いので、あまり参考にはならないかもしれないですが、HTMLの基礎勉強の中だと使われてるタグはほとんどの学習プラットフォームでこれくらいかなと思います。