[Labyrinthe Noir]>[Top]>[HTMLタグ講座]>

HTML5の主要タグ一覧

グローバル属性が定義され、idやclassはすべてのタグに使用される。

  開始タグ 終了タグ 意味 使用可能な属性
使用例
DTD <!DOCTYPE> <html>タグの前にHTMLのバージョンを表す文書型宣言(DTD)を挿入します。
これによりHTML5のルールに基づいた文書だとブラウザは判断します。
 
<!DOCTYPE html>
基本 <html> </html> HTML文書であることを宣言 lang manifest
<html lang="jp">
<head> </head> ブラウザ内に表示されない文書情報を記述  
<body> </body> ブラウザ内に表示させる文字列やタグを記述  
ヘッダ タイトル <title> </title> ブラウザに表示されるタイトル。ブックマーク(お気に入り登録)したときの見出しにもなる  
関連 <meta> HTMLファイルに属性を追加します name http-equiv content charset
<meta charset="UTF-8">
<meta http-equiv="refresh" content="10; url=top.html">
<link> 関連するファイルを読み込む href rel type sizes
<link rel="stylesheet" href="sample.css" type="text/css">
<link rel="icon" href="favicon.icon" type="image/vnd.microsoft.icon">
<link rel="icon" href="sample.png" type="image/png" sizes="16x16 32x32">
CSS <style> </style> CSSを記述する media type scoped
<style type="text/css">
ボディ 段落 <h1>~<h6> </h1>~</h6> 見出しタグ。行位置の指定も可  
<hr> 段落の間に水平線を引く  
<p> </p> 行間あり改行。段落の範囲と行位置を指定  
<br> 行間なし改行 clear
<div> </div> 行単位で範囲を指定 id class
<blockquote> </blockquote> 注釈  
テキスト <strong> </strong> 文字を太字にする  
<em> </em> 文字を斜体にする  
<del> </del> 文字に取り消し線を付ける  
<span> </span> 文字単位で範囲を指定 id class
<sup> </sup> 文字を上付きにする  
<sub> </sub> 文字を下付にする  
<ruby> </ruby> ルビを付ける範囲  
<tr> </tr> ルビとして振るテキスト  
<!--注釈--> 注釈。間に書いた文字は表示されない  
&キーワード; キーワードに対応した文字を表示  
リスト <ul> </ul> 「・」などの記号で始まるリストの範囲を指定 type
<ol> </ol> 番号やアルファベットで始まるリストの範囲を指定
<li> </li> <UL>または<OL>の中で使用。 リストの箇条書き項目
リンク <a> </a> アンカータグ
ハイパーリンクの範囲を指定
href target title
<a href="sample.html" title="これはリンクです" target="_blank">
画像 <img> 画像をファイルから読み込む  src border width height align vspace hspace alt id
<img src="sample.jpg" border="0" width="200" height="150" alt="サンプル画像">
<canvas> 画像を命令文によって描画する id width height
テーブル <table> </table> テーブルの外枠と範囲を指定
以下のタグはこの中でないと使えない
border width height cellpadding cellspacing
<caption> </caption> テーブルのタイトル align valign
<tr> </tr> テーブルの行 width height
<td> </td> テーブルのセル width height colspan rowspan nowrap
<th> </th> テーブルの見出しとなるセル
フォーム <form> </form> フォームの範囲と送信の設定を指定。省略可 name id action method enctype target accept-charset accept
<input> テキストの入力フィールドやボタン、ラジオボタン、チェックボックスなど form name id type value disabled autofocus
type属性:hidden text search tel url email password datetime date month week time datetime-local number range color checkbox radio file submit image reset button
<button> </button> ボタンを表示 form formaction formmethod name type value disabled
type属性:submit reset button
<label> </label> ボタン類の代わりにクリックできるテキストを指定 form for
<select> </select> セレクトメニューの範囲を指定 form name size multiple disabled value required
<option> </option> セレクトメニューの項目 id value selected label disabled
<textarea> </textarea> 改行可能なテキストフィールド name rows cols wrap disabled
スクリプト <script> </script> JavaScriptなどスクリプト言語を記述する type src charset
<script type="text/javascript" src="sample.js">

戻る