「HTML」タグアーカイブ

PC・スマートフォン

よく使うHTMLタグ

コメントする

今回は、よく使うHTMLタグを10種類ほど紹介していきます。

関連記事

HTMLエディター

HTMLを作成するにあたり、エディターをインストールすることを推奨します。

メモ帳でも作成できますが、タイプミスがあった際などに判りやすくなります。

Microsoftの「Visual Studio Code」やフリーウェアの「サクラエディタ」などがありますので、ダウンロードしてインストールしておきます。

基本的な書き方

まず、HTMLをマークアップしていく上で必須の項目を紹介します。

  • <!DOCTYPE html>　HTMLの先頭に必ず入力します
  • <html lang=”ja”>　HTMLの言語を指定します
  • <head></head>　この中に文字コードやスタイルシートの場所、タイトルなどを入力します
  • <meta charset=”UTF-8″>　文字コードを指定します
  • <link rel=”stylesheet” href=”css/style.css”>　スタイルシートの場所を指定します
  • <title></title>　タイトルを入力します（ブラウザのタブや検索結果に表示されます）
  • <body></body>　この中にコンテンツを入力していきます
  • <header></header>　ナビゲーションなどのヘッダーを入力します
  • <main></main>　メインコンテンツを入力します
  • <footer></footer>　権利表示などをフッターに入力します
  • </html>　HTMLの末尾に必ず入力します

※HTMLタグは必ず半角小文字で入力します
（大文字は非推奨、全角はタグとして認識しません）

<!DOCTYPE html>
<html lang="ja">

↓以下はブラウザ上には表示されません
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="css/style.css">
<title>よく使うHTMLタグ</title>
</head>

↓ここからはブラウザ上に表示されます
<body>
  <header>
<!--この間にヘッダーを挿入します-->
  </header>
  <main>
<!--この間にメインコンテンツを挿入します-->
  </main>
  <footer>
    <div class="copy">
      <small>&copy;2022 RyoElectricBLOG</small>
    </div>
  </footer>
</body>
</html>
続きを読む よく使うHTMLタグ →