使用頻度が高いHTMLタグをまとめてみました。
基本構造
|タグ|名前|用途|
| --- | --- | --- |
|html|エイチティーエムエル|HTML文書を表す|
|head|ヘッド |HTML文書のヘッダー部分。説明文、CSSファイルのリンク、ページタイトルを記述する|
|mata|メタ |言語や説明文など、ページ情報を記述する|
|title|タイトル|ページのタイトル。この部分がページタイトルとして表示される |
|link|リンク|参照する外部ファイル(CSSファイルなど)|
|body|ボディー|HTML文書のコンテンツ部分。この中に記述されたものがブラウザに表示される |
コンテンツ内
| タグ |
名前 |
用途 |
| h1-h6 |
エイチワン・ヘディング |
見出し 数字の順に記述 |
| p |
ピー・パラグラフ |
文章の段落 |
| a |
エー・アンカー |
リンクを貼る。リンク先href属性 |
| img |
イメージ |
画像を表示。src属性で画像を指定 |
| ul |
ユーエル・アンオーダードリスト |
番号のない箇条書きリスト |
| li |
エルアイ・リスト |
リストの各項目 |
| br |
ビーアール・ブレーク |
改行 |
| span |
スパン |
意味を持たないインライン要素。CSSで一部のみ装飾するとき使用する |
| strong |
ストロング |
強い重要性要素。一般的に太文字 |
| small |
スモール |
著作権・法的表示 |
| blockquote |
ブロッククォート |
引用文・転載であることを表わす |
| audio |
オーディオ |
音声データ埋め込む |
| video |
ビデオ |
動画データを埋め込む |
| script |
スクリプト |
scriptデータ埋め込んだり参照。javascriptのコードを使用する。 |
表
| タグ |
名前 |
用途 |
| table |
テーブル |
表を示すタグ。表全体で囲む |
| tr |
ティーアール・テーブルロウ |
表の一行を囲む |
| th |
ティーエイチ・テーブルヘッダー |
表の見出しセルを表す |
| td |
ティーディー・テーブルデータ |
データセルを表す |
フォーム
| タグ |
名前 |
用途 |
| form |
フォーム |
フォームを作成 |
| input |
インプット |
フォームにおける入力フォーム作成 |
|
テキスト |
1行テキスト入力欄 |
| <input type="checkbox" |
チェックボックス |
チェックボックス。複数の項目を選択可能 |
| <input type-"radio" |
ラジオ |
ラジオボタン複数項目のうち一つ選択可能 |
| select |
セレクト |
セレクトボックス |
| option |
オプション |
セレクトボックスの選択項目を作成 |
| textarea |
テキストエリア |
複数行テキストの入力欄 |
| label |
ラベル |
フォームのラベル。フォームのパーツと項目の名前を関連つける |
| placeholder |
プレースホルダ |
入力欄に(例)初期表示する内容を指定できる |
グループのブロック要素
|タグ | 名前 | 用途|
|---|---|---|
|div|ディブ・ディヴィジョン|意味を持たないブロック要素|
|header|ヘッダー|ページ上部にある要素。主にロゴやメニューで使用|
|nav|ナビ|メインのナビゲーションメニュー|
|artcle|アーティクル|ページ内の記事となる部分。その文章やコンテンツだけが独立しても意味が通るような箇所を示す要素。(例)ブログの記事やニュースサイトの記事など|
|aside|アサイド|本文ではない補足情報。メインコンテンツとは関連性が低い情報。(例)サイドナビに配置した補足的なテキストや他サイトへのリンク、バナー、広告など|
|section|セクション|一つのテーマを持ったグループ|
|main|メイン|ページのメインコンテンツ部分|
|footer|フッター|ページ下部にある要素。メニュー一覧（フッターメニュー）や著者情報、会社情報、免責事項ページなどへのリンクや、コピーライトなど|
