background-color

border

<h1>

h1 {
  /* 問題1. <h1>タグの背景色を#fff2f2にしてください */
  /* 問題2. <h1>タグに太さ2px・実線・#000000の枠線をを追加してください */
  /* この下に解答してください */
  background-color: #fff2f2;
  border: 2px solid #000000;
}


h1 {
  /* 問題1. <h1>タグの背景色を#fff2f2にしてください */
  /* 問題2. <h1>タグに太さ2px・実線・#000000の枠線をを追加してください */
  /* この下に解答してください */
}


背景色と枠線

color

font-size

文字の色と大きさ

font-weight

text-align

文字の太さと配置

width

height

横幅と高さ

padding

padding: 10px 20px 30px;

上記のような場合、余白は上が$(1)px、右が$(2)px、下が$(3)px、左が$(4)pxとなる。

内側の余白

margin

margin: 10px 20px 30px 40px;

上記のような場合、余白は上が$(1)px、下が$(2)px、左が$(3)px、右が$(4)pxとなる。

外側の余白

<ul>

<li>

間隔を空けてボックスを並べよう（演習問題）

ウェブページに美しいスタイルを加えるためのCSSの書き方を練習します。
テキストのスタイルから背景色の設定まで、基礎的なスタイリングを習得します。