LoginSignup
0
2

More than 1 year has passed since last update.

🔰【初学者用】本当に初歩の初歩の初歩的なよく使うHTMLタグをまとめてみた。

Posted at

はじめに

毎日Qiita投稿5日目です。
今回は初学者が最低限覚えておくべき、本当に初歩の初歩の初歩的なHTMLタグをまとめていきます。

基本構造、head内

タグ 使用用途
html HTML文書であることを表す。
head 基本的にHTMLのヘッダ部分に記載。中の記述はブラウザには表示されない。この中にページのタイトルやcssファイルリンクなどを記載。
meta 言語や説明文などのページ情報を記載。初学の頃は主にUTF-8のを記述するイメージ。
title ページのタイトルブラウザーのタブにここの記載が表示される。
link 参照する外部ファイル主にcssファイルを読み込む。
body HTMLのコンテンツ部分。この中の記述がブラウザーに表示される。

コンテンツ内

タグ 使用用途
h1〜h6 見出し。基本的には数字順位記述していく。
p 段落。
img 画像。srcで画像取得。
a リンク。hrefでリンク取得 。
ul 箇条書きリスト。
ol 番号付き箇条書きリスト。
li リストの各項目。
br 改行。
strong 重要な要素。太字で表示される。
small 著作権や法的表記。
span インライン要素。CSSで一部表示を変えたいときなどに使用。
script javascriptを記述する際に使用する。

表(テーブル)

タグ 使用用途
table 表(テーブル)全体。
tr 表の1行。
th 表の見出しとなるセルを作成。
td 表のデータとなるセルを作成。

フォーム

タグ 使用用途
form フォームを作成する。
<input type="text"> 1行テキスト入力欄。
<input type="radio"> 選択項目のうち1つだけ選択可能なラジオボタン
<input type="checkbox"> 複数選択可能なチェックボックス。
<input type="submit"> 送信ボタン。
select セレクトボックス。
textarea 複数行入力可能なテキスト入力欄。
label ファームのラベル。フォームの項目と名前を関連付ける事ができる。

ブロック要素

タグ 使用用途
header ページ上部の要素。
nav メインのナビゲーション。
article ページの記事部分。
section 意味や機能のひとまとまり。
main ページのメインコンテンツ。
aside 補足情報や、メインコンテンツとは関連性が低い部分。
footer ページ下部の要素。©やSNSリンクなど。
div ブロック要素。

終わりに

今回はHTMLの基本的なタグをまとめてみました!
初学者の方がこれを全て一気に覚えるのは大変です。暗記教科のよう覚える必要はなく、コード書いてたら覚えていった。使いながら覚えていくという形が一番の近道かなと思います!
だからコードに触れる時間は多く取りたいですね。

※プログラミングを始めてまだ月日も浅い初学者が投稿しています。誤字脱字等ありましたら申し訳ないです。何か間違いがあればご指摘いただけると助かります。

0
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
2