ボックスモデルの理解

知識課題

知識課題１

以下の点について、ボックスモデルを調査し、説明してください。

• ボックスモデルとは何か
• 以下の各構成要素の特徴
  • margin
  • border
  • padding
  • content

実践課題

実際のWebサイトでボックスモデルの使用例を確認し、理解を深めましょう。

1. Google Chromeを起動し、任意のWebサイトを開く
2. デベロッパーツールを開く（Command + Option + I）
3. 任意の要素を選択し、以下を確認する
   • 選択した要素のボックスモデルの視覚的な表示
   • 各構成要素（margin, border, padding, content）の具体的な値