内容のまわりの空間の設定内容のまわりの空間部分の大きさを設定するには、 padding-???プロパティを設定します。 padding-top: 上の空間部分 padding-bottom: 下の空間部分 padding-left: 左の空間部分 padding-right: 右の空間部分 padding: 上下左右の空間部分 </pre> #ref(Lecture/InfoDesignB2004/8th/padding/css01.png,nolink,ボックスの構造) 空間部分の大きさは、次の設定ができます。 -%: ボックスの横幅に対する割合 -単位つき数値: 10px、1.5emなど paddingプロパティを使えば、 上下左右の空間部分を一度に指定できます。 その場合は、値を半角スペースで区切ります。 値の個数によって、次のように空間部分が設定されます。 -値が1つ: 「上下左右」を指定 -値が2つ: 1つ目の値は「上下」、2つ目の値は「左右」 -値が3つ: 1つ目の値は「上」、2つ目の値は「左右」、3つ目は「下」 -値が4つ: 1つ目の値は「上」、2つ目の値は「右」、3つ目は「下」、4つ目は「左」 #pre(novervatim){{ h2.note{ padding-left: 10px; padding-right: 20px; } h2.example{ padding: 10%; } </pre> |