HTMLは、Webページの「骨組み」を作る言語です。
文字や画像、リンクなどを配置するために使います。
下の一覧は、HTMLでよく使うタグをまとめたものです。
分からないときに調べながら使ってください。
<」のように書きます。
| タグ | 意味 | 例 |
|---|---|---|
| <!DOCTYPE html> | これがHTML5の文書であることを宣言 | <!DOCTYPE html> |
| <html> | HTML文書の始まりと終わり | <html>...</html> |
| <head> | 文書の裏側の設定（画面には出ない） | <head>...</head> |
| <body> | 画面に表示される中身 | <body>...</body> |
| <title> | ページのタイトル（タブに表示） | <title>タイトル</title> |
| <meta> | 文字コードなどの設定 | <meta charset="UTF-8"> |
| <link> | CSSなどの外部ファイルの読み込み | <link rel="stylesheet" href="style.css"> |
| <style> | CSSを直接書く | <style>body { color: red; }</style> |
| <script> | JavaScriptを書く・読み込む | <script>alert('！');</script> |
| <noscript> | JSが動かない時の代わりの内容 | <noscript>JSをONにしてね</noscript> |
| <template> | JSで後から使うためのひな形 | <template>...</template> |
| <h1>〜<h6> | 見出し（h1が一番大きい） | <h1>大見出し</h1> |
| <p> | ひとつの段落（文章） | <p>本文です</p> |
| <br> | 改行 | 1行目<br>2行目 |
| <hr> | 水平線（区切り線） | <hr> |
| <pre> | 改行や空白をそのまま表示 | <pre> そのまま </pre> |
| <blockquote> | 引用した文章 | <blockquote>引用文</blockquote> |
| <header> | ヘッダー（上部の領域） | <header>ロゴやメニュー</header> |
| <footer> | フッター（下部の領域） | <footer>© 2026</footer> |
| <main> | ページのメインコンテンツ | <main>メイン部分</main> |
| <section> | 意味のある区切り（章など） | <section>...</section> |
| <article> | 独立した記事 | <article>ブログ記事</article> |
| <nav> | ナビゲーションリンク | <nav><a href="#">メニュー</a></nav> |
| <aside> | 補足情報（サイドバーなど） | <aside>広告や関連リンク</aside> |
| <figure> | 図表や写真などのまとまり | <figure><img src="a.jpg"></figure> |
| <div> | グループ化（特に意味を持たない） | <div class="box">...</div> |