HTMLでスタイル定義を作成する方法｜styleタグの使い方を解説
HTMLのstyleタグとは
HTMLの<style>タグは、HTMLドキュメントの<head>セクション内でスタイルシートを宣言するために使用されます。このタグ内にCSSコードを直接記述することで、ページ全体の文字色やレイアウト、表のデザインなどを自由に制御できます。
styleタグの主な属性
<style>タグで使用できる主な属性は以下のとおりです。
| 属性 | 値 | 説明 |
|---|---|---|
| type | text/css | スタイルシートの言語をコンテンツタイプ(MIMEタイプ)として指定します。 |
| media | screen | ドキュメントを表示するデバイス(画面)を指定します。 |
| tty tv projection handheld braille aural all | その他の対応デバイス。それぞれテキスト端末、テレビ、プロジェクター、携帯端末、印刷、点字端末、音声読み上げ、すべてのデバイスを表します。 |
使用例
以下のコードを実行すると、HTMLでスタイル定義を作成する方法を実際に確認できます。ここでは、表(table)とそのセル(th、td)に黒い枠線を付けるスタイルを定義しています。
<!DOCTYPE html>
<html>
<head>
<style>
table, th, td {
border: 1px solid black;
}
</style>
</head>
<body>
<h3>Ranking</h3>
<table>
<th>Rank</th>
<tr>
<td>One</td>
</tr>
<tr>
<td>Two</td>
</tr>
</table>
</body>
</html>補足ポイント
HTML5では、<style>タグのtype属性は省略可能です。これはCSSがデフォルトのスタイルシート言語として扱われるためです。また、media属性を活用すれば、「印刷時のみ適用されるスタイル」や「画面表示用のスタイル」など、デバイスごとに異なるデザインを1つのHTMLファイル内で切り替えることも可能です。
-
HTMLで参考文献（Bibliography）を作成する方法
参考文献（Bibliography）とは、執筆時に参照した書籍や資料の一覧をまとめて記載するセクションのことです。HTMLを使えば、こうした参考文献リストを簡単に作成できます。具体的には、<ol>タグで書籍を番号付きリストとして列挙し、<cite>タグで作品のタイトルをマークアップします。 <cite>タグは、書籍のタイトルだけでなく、楽曲、絵画、映画など、さまざまな作品のタイトルを示す際にも使用できます。このタグは「引用」を意味しており、タグ内に記述した内容はすべて作品のタイトルとして扱われます。 サンプルコード それでは、実際にHTMLで参考文献リスト
-
HTMLのstyle属性とは？構文と使い方をサンプルコード付きで解説
HTMLのstyle属性は、ドキュメント内の個々の要素に対してインラインスタイルを直接指定するための属性です。style属性はグローバル属性に分類されるため、すべてのHTML要素で使用できるのが特徴です。 style属性の基本 style属性の値には、「プロパティ名: 値;」という形式でCSSを記述します。複数のスタイルを同時に指定したい場合は、セミコロン（;）で区切って並べることで、1つの要素にまとめてスタイルを適用できます。 構文 style属性の基本的な構文は次のとおりです。 <タグ名 style="CSSプロパティ: 値;"></タグ名> そ