キャプションの追加
CoddyのHTMLジャーニー「Fundamentals」セクションの一部 — レッスン 49/60。
HTMLのテーブルにおいて、キャプションはテーブルのタイトルや説明です。これはテーブルの内容に関する簡潔な説明を提供し、ユーザーがテーブルの目的を理解しやすくします。キャプションは <caption> タグを使用して作成され、このタグは <table> タグの直後に配置する必要があります。
HTMLでテーブルにキャプションを追加するための基本的な構文は次のとおりです。
<table>
<caption>Table Caption</caption>
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>Row 1, Cell 1</td>
<td>Row 1, Cell 2</td>
</tr>
</table>
チャレンジ
簡単キャプション付きのテーブルを含むHTMLドキュメントを作成してください。テーブルは以下の構造にする必要があります。
- テーブルを定義するための
<table>タグ。 - テーブルを説明するための、"Product Inventory" というテキストを持つ
<caption>タグ。 - 2つのヘッダーセル (
<th>) を持つヘッダー用のテーブル行 (<tr>)。ヘッダーセルには "Product Name" と "Quantity" と記述してください。 - 2つのデータセル (
<td>) を持つテーブル行 (<tr>)。セルには "Laptop" と "5" と記述してください。 - もう1つの、2つのデータセル (
<td>) を持つテーブル行 (<tr>)。セルには "Mouse" と "10" と記述してください。
チートシート
<caption>タグは、HTMLテーブルのタイトルや説明を提供します。これは、<table>タグの直後に配置する必要があります。
<table>
<caption>Table Caption</caption>
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>Row 1, Cell 1</td>
<td>Row 1, Cell 2</td>
</tr>
</table>自分で試してみよう
<!DOCTYPE html>
<html>
<body>
<!-- ここにコードを書いてください -->
</body>
</html>
腕試しこのレッスンには短いクイズがあります。レッスンを始めて解答し、進捗を記録しましょう。
