基本構造・HEAD 内
| !DOCTYPE html | ドキュメントタイプを宣言する Defines the document type |
|---|---|
| html | HTML文書であることを宣言する <html>タグとlang属性 |
| head | 文書のヘッダ情報を表す。ブラウザーには表示されない。 検索エンジン用説明文やCSSファイルへのリンク、ページタイトルを記述 <head>~</head> The <head> element is a container for all the head elements. The <head> element can include a title for the document, scripts, styles, meta information, and more. |
| meta | 言語や説明文などページの情報 <meta>~ ※空要素(終了タグなし) Metadata is data (information) about data. The <meta> tag provides metadata about the HTML document. Metadata will not be displayed on the page, but will be machine parsable. |
| title | ページタイトル <title>~</title> The <title> tag is required in all HTML documents and it defines the title of the document. |
| link | 参照する外部ファイル、主にCSSファイルを読み込む時につかう。 <link>~ ※空要素(終了タグなし) The <link> tag defines a link between a document and an external resource. The <link> tag is used to link to external style sheets. |
| body | html文書のコンテンツ。この中に書かれたものがブラウザーに表示される。 <body>~</body> Defines the document's body The <body> element contains all the contents of an HTML document, such as text, hyperlinks, images, tables, lists, etc. |
参考ページ:HTMLの基本とCSS「HEADに入れるTAG」
コンテンツ 内
| h1~h6 | 見出し(heading) The <h1> to <h6> tags are used to define HTML headings. <h1> defines the most important heading. <h6> defines the least important heading. |
|---|---|
| p | ひとつの段落(paragraph)であることを表す The <p> tag defines a paragraph. |
| img | 画像(image)を表示。表示する画像ファイルはsrc属性(srcはsourceの略)で指定 <img src="images/flower.jpg" width="150" height="120" alt="花"/> ※空要素(終了タグなし) The <img> tag defines an image in an HTML page. The <img> tag has two required attributes: src and alt. In HTML the <img> tag has no end tag. |
| a | リンクを貼る。リンク先はhref属性(hrefはHypertext Referenceの略)で指定 <a href="../index.html">トップページへ</a> ※空要素(終了タグなし) The <a> tag defines a hyperlink, which is used to link from one page to another. The most important attribute of the <a> element is the href attribute, which indicates the link's destination. |
| ul | 番号のない箇条書きリスト The <ul> tag defines an unordered (bulleted) list. Use the <ul> tag together with the <li> tag to create unordered lists. |
| ol | 番号付き箇条書きリスト The <ol> tag defines an ordered list. An ordered list can be numerical or alphabetical. Use the <li> tag to define list items. |
| li | リストの各項目 The <li> tag defines a list item. |
| br | 改行 ※空要素(終了タグなし) Defines a single line break The <br> tag is an empty tag which means that it has no end tag. |
| hr | 横線をひく(Horizontal Rule) ※空要素(終了タグなし) The <hr> tag defines a thematic break in an HTML page |
| strong | 強調する。 Defines important text |
| blockquote | 引用文 The <blockquote> tag specifies a section that is quoted from another source. |
| span | 意味のもたないインライン要素。CSSで一部分のみ装飾するときに使う The <span> tag is used to group inline-elements in a document. The <span> tag provides no visual change by itself. The <span> tag provides a way to add a hook to a part of a text or a part of a document. |
| audio | 音声のデータを埋め込むときに使う The <audio> tag defines sound, such as music or other audio streams. |
| video | 動画のデータを埋め込むときに使う The <video> tag specifies video, such as a movie clip or other video streams. |
| script | 文書にスクリプトを埋め込む The <script> tag is used to define a client-side script (JavaScript). |
テキスト表現
| font | フォントの種類・大きさ・色を指定する The <font> tag specifies the font face, font size, and color of text. |
|---|---|
| b | テキストを太字にする Defines bold text |
| u | テキストに下線(アンダーライン)を引く The <u> tag represents some text that should be stylistically different from normal text, such as misspelled words or proper nouns in Chinese. |
| mark | 文字にマーカー The <mark> tag defines marked text. Use the <mark> tag if you want to highlight parts of your text. |
| s | The <s> tag specifies text that is no longer correct, accurate or relevant. |
表(テーブル)
| table | テーブル(表)を作成する The <table> tag defines an HTML table. An HTML table consists of the <table> element and one or more <tr>, <th>, and <td> elements. |
|---|---|
| tr | 横方向の一行を定義する The <tr> tag defines a row in an HTML table. |
| th | 見出しセルを作成する The <th> tag defines a header cell in an HTML table. |
| td | データセルを作成する The <td> tag defines a standard cell in an HTML table. |
| thead | ヘッダ行を定義する The <thead> tag is used to group header content in an HTML table. |
| tfoot | フッタ行を定義する The <tfoot> tag is used to group footer content in an HTML table. |
| tbody | ボディ部分を定義する The <tbody> tag is used to group the body content in an HTML table. |
| caption | テーブル(表)にタイトルをつける The <caption> tag defines a table caption. |
フォーム
| form | 入力・送信フォームを作成する The <form> tag is used to create an HTML form for user input. |
|---|---|
| input type="submit | フォームの送信ボタン・リセットボタンを作成する Defines a submit button |
| input type="text" | 一行テキストボックスを作成する Default. Defines a single-line text field |
| input type="radio" | ラジオボタンを作成する Defines a radio button |
| input type="checkbox | チェックボックスを作成する Defines a checkbox |
| select | セレクトボックスを作成する The <select> element is used to create a drop-down list. |
| option | セレクトボックスの選択肢を指定する The <option> tags inside the <select> element define the available options in the list. |
| textarea | 複数行の入力フィールドを作成する The <textarea> tag defines a multi-line text input control. |
| label | フォーム部品と項目名(ラベル)を関連付ける The <label> tag defines a label for a <button>, <input>, <meter>, <output>, <progress>, <select>, or <textarea> element. |
グループ分け用ブロック要素
| header | ページ上部にある要素。ロゴやページタイトル、メインナビゲーションを囲む The <header> element represents a container for introductory content or a set of navigational links. |
|---|---|
| nav | メインのナビゲーションメニュー The <nav> tag defines a set of navigation links. |
| article | ページ内の記事となる部分。小さい記事をまとめる The <article> tag specifies independent, self-contained content. |
| section | 一つのテーマをもったグループ。小さい記事 The <section> tag defines sections in a document, such as chapters, headers, footers, or any other sections of the document. |
| main | ページのメインコンテンツ The <main> tag specifies the main content of a document. |
| aside | 本文ではない補足情報 The <aside> tag defines some content aside from the content it is placed in. The aside content should be related to the surrounding content. |
| footer | ページ下部にある要素。コピーライトやSNSリンクなどを含んでいる The <footer> tag defines a footer for a document or section. |
| div | 意味を持たないブロック要素 The <div> tag defines a division or a section in an HTML document. The <div> element is often used as a container for other HTML elements to style them with CSS or to perform certain tasks with JavaScript. |
