どんなタグ？
文書のタイトルや名前を表す時に使う、
名札のようなタグ。
<!DOCTYPE html>
<html lang="ja">
<head>
<title>
title要素のサンプルページ| HTMLリファレンス | CodeHero
</title>
</head>
<body>
<h1>ここにコンテンツが表示されます！</h1>
<p>title要素の内容はここには表示されません！</p>
</body>
</html>
title 要素は<title> ~ </title>で挟まれた範囲が、そのサイトやページのタイトルであることを表すタグです。
このタグはページ内に複数あってはいけません。
- どのカテゴリに属しているの？
- <title>タグは メタデータ・コンテンツ というコンテンツ・カテゴリに属しているタグです。
- 梱包できるタグは？
-
<title>タグに梱包できるものは、テキスト（ただし、空白のみはNG）です。
サイトやページに名前をつけるタグです！
どうやって使うの？
タイトルのテキストを、
<title> タグで挟む。
<title>タグは<head>タグ内に記述して、タイトルにしたいテキストを<title> 〜 </title> で挟みます。
- 使い方
<title>タイトルにしたいテキスト</title>
<!DOCTYPE html>
<html lang="ja">
<head>
<title>
title要素のサンプルページ| HTMLリファレンス | CodeHero
</title>
</head>
<body>
<h1>ここにコンテンツが表示されます！</h1>
<p>title要素の内容はここには表示されません！</p>
</body>
</html>https://codehero.shibajuku.net/html/title/title01/
- どこでも使えるの？
- <title>タグは 他にタグを含まない、head要素の子要素として 配置できるところで使えます。
- 気をつけることは？
- 検索エンジンの結果ページ
- 閲覧者のブックマーク
- ブラウザのタブ など様々なところで表示されるため、ページの内容が分かりやすいタイトルにしましょう。
ページの内容が分かりやすいタイトルをつけましょう！
使える属性は？
グローバル属性のみ使えます。
<title> タグには、どの要素にでも使えるグローバル属性が使えます。
グローバル属性が使えますが、通常<title>タグに属性はつけません。
サンプルが見たい
<title>タグを使ったサンプルを
いくつか紹介。
<title> タグを使ったサンプルを紹介します。
基本的な<title>タグのサンプル
<!DOCTYPE html>
<html lang="ja">
<head>
<title>
このページのタイトル| HTMLリファレンス | CodeHero
</title>
</head>
<body>
<h1>ここに本文が入ります</h1>
</body>
</html>https://codehero.shibajuku.net/html/title/title02/
ページ内容が分かりやすい<title>タグのサンプル
<!DOCTYPE html>
<html lang="ja">
<head>
<title>
title要素のサンプルページ| HTMLリファレンス | CodeHero
</title>
</head>
<body>
<h1>ここにコンテンツが表示されます！</h1>
<p>title要素の内容はここには表示されません！</p>
</body>
</html>https://codehero.shibajuku.net/html/title/title01/
ページの内容が分かりやすいように、各ページに固有のタイトルをつけるようにしましょう！
デフォルトスタイルは？
特に表示に影響する
スタイルはついていません。
Chromeで html要素を表示した場合、下記のCSSと同等のスタイルが適用されています。
その他のブラウザでは、特に指定はありません。
title {
display: none;
}特に表示に影響するスタイルはありません。
対応ブラウザは？
どのブラウザでも使えます！
<title>タグは HTML1以降で利用可能で、主に以下のブラウザが対応しています。
- Internet Explorar
- Internet Explorar あり
- Edge
- Edge あり
- Google Chrome
- Google Chrome あり
- Firefox
- Firefox あり
- Safari
- Safari あり
- Opera
- Opera あり
モダンブラウザは問題ありません。
