ＣＳＳ講座⑦ （余白）

BACK

---

■　ＣＳＳ講座⑦　（余白）

---

---

◆　幅・高さ

---

★　横幅

width:100px;

●　auto　　　　　　　　　自動（初期値）
●　px　　　　　　　　　　ピクセルで指定
●　%　　　　　　　　　　 パーセントで指定

---

★　縦幅

height:100px;

●　auto　　　　　　　　　自動（初期値）
●　px　　　　　　　　　　ピクセルで指定
●　%　　　　　　　　　　 パーセントで指定

---

★　最大の横幅

max-width:100px;

●　none　　　　　　　　　指定なし（初期値）
●　px　　　　　　　　　　ピクセルで指定
●　%　　　　　　　　　　 パーセントで指定

---

★　最大の縦幅

max-height:100px;

●　none　　　　　　　　　指定なし（初期値）
●　px　　　　　　　　　　ピクセルで指定
●　%　　　　　　　　　　 パーセントで指定

---

★　最小の横幅

min-width:100px;

●　none　　　　　　　　　指定なし（初期値）
●　px　　　　　　　　　　ピクセルで指定
●　%　　　　　　　　　　 パーセントで指定

---

★　最小の縦幅

min-height:100px;

●　none　　　　　　　　　指定なし（初期値）
●　px　　　　　　　　　　ピクセルで指定
●　%　　　　　　　　　　 パーセントで指定

---

◆　マージン・パディング

---

★　上のマ－ジン

margin-top:30px;

●　auto　　　　　　　　　自動（初期値）
●　px　　　　　　　　　　ピクセルで指定（マイナス値可）
●　%　　　　　　　　　　 パーセントで指定

---

★　下のマ－ジン

margin-bottom:30px;

●　auto　　　　　　　　　自動（初期値）
●　px　　　　　　　　　　ピクセルで指定（マイナス値可）
●　%　　　　　　　　　　 パーセントで指定

---

★　右のマ－ジン

margin-right:30px;

●　auto　　　　　　　　　自動（初期値）
●　px　　　　　　　　　　ピクセルで指定（マイナス値可）
●　%　　　　　　　　　　 パーセントで指定

---

★　左のマ－ジン

margin-left:30px;

●　auto　　　　　　　　　自動（初期値）
●　px　　　　　　　　　　ピクセルで指定（マイナス値可）
●　%　　　　　　　　　　 パーセントで指定

---

★　上・右・下・左のマ－ジンの一括指定

margin:30px 20px 10px 5px;

margin:上 右 下 左;

●　auto　　　　　　　　　自動（初期値）
●　px　　　　　　　　　　ピクセルで指定（マイナス値可）
●　%　　　　　　　　　　 パーセントで指定

１個指定　margin:20px;　　　　　　　　 　上下左右
２個指定　margin:20px 30px;　　　　　　　上下　左右
３個指定　margin:20px 30px 40px;　　　 　上　左右　下
４個指定　margin:20px 30px 40px 50px;　　上　下　左　右

---

★　上のパディング

padding-top:30px;

●　auto　　　　　　　　　自動（初期値）
●　px　　　　　　　　　　ピクセルで指定（マイナス値可）
●　%　　　　　　　　　　 パーセントで指定

---

★　下のパディング

padding-bottom:30px;

●　auto　　　　　　　　　自動（初期値）
●　px　　　　　　　　　　ピクセルで指定（マイナス値可）
●　%　　　　　　　　　　 パーセントで指定

---

★　右のパディング

padding-right:30px;

●　auto　　　　　　　　　自動（初期値）
●　px　　　　　　　　　　ピクセルで指定（マイナス値可）
●　%　　　　　　　　　　 パーセントで指定

---

★　左のパディング

padding-left:30px;

●　auto　　　　　　　　　自動（初期値）
●　px　　　　　　　　　　ピクセルで指定（マイナス値可）
●　%　　　　　　　　　　 パーセントで指定

---

★　上・右・下・左のパディングの一括指定

padding:30px 20px 10px 5px;

padding:上 右 下 左;

●　auto　　　　　　　　　自動（初期値）
●　px　　　　　　　　　　ピクセルで指定（マイナス値可）
●　%　　　　　　　　　　 パーセントで指定

１個指定　padding:20px;　　　　　　　　 　上下左右
２個指定　padding:20px 30px;　　　　　　　上下　左右
３個指定　padding:20px 30px 40px;　　　 　上　左右　下
４個指定　padding:20px 30px 40px 50px;　　上　下　左　右

---

BACK