8. 字下げ・余白・文字行の高さ・文字の間隔

CHECK POINTS
text-indentmarginpaddingline-heightletter-spacing
■字下げ

   text-indent: x    // x サイズ(em, px, %)

■余白による全体の字下げ

@ マージン(外側余白)
   margin: x         // x サイズ(em, px, %)         * 全部
   margin: x y     // x 上下, y 左右              * 上から下
   margin: x y z       // x 上,   y 左右, z 下        * 上から下
  margin: x y z w     // x 上,   y 右,   z 下, w 左  * 時計回り

  margin-top: x       // x 上のみ
   margin-right: x   // x 右のみ
   margin-bottom: x    // x 下のみ
   margin-left: x      // x 左のみ

例:<P>の上外側及び左外側を1字分空ける

 P {margin-top: 1em; margin-left: 1em}   // 1文字を 1em とした場合
 
A パディング(内側余白)
   padding: x        // x サイズ(em, px, %)         * 全部
   padding: x y    // x 上下, y 左右              * 上から下
   padding: x y z      // x 上,   y 左右, z 下        * 上から下
  padding: x y z w    // x 上,   y 右,   z 下, w 左  * 時計回り

  padding-top: x      // x 上のみ
   padding-right: x  // x 右のみ
   padding-bottom: x   // x 下のみ
   padding-left: x     // x 左のみ

例:<P>の左内側全体を1字分空ける

  P {padding-left: 1em}  // 1文字を 1em とした場合