09.paddingプロパティは、ボックスの枠線と文字列(内容)の間隔を設定します。 4辺まとめて設定する方法と、個々に設定する方法があります。 適用要素:すべての要素(tr要素、thead要素、tbody要素、tfoot要素col要素、colgroup要素を除く)


※★CSS
.box71 {
	padding: 10px;
        background-color:#fcccff;}
	
.box72 {
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	background-color:#fcccff;}

.box711 {
	padding: 50px;
        background-color:#fcccff;}
	
.box722 {
	padding-top: 50px;
	padding-right: 50px;
	padding-bottom: 50px;
	padding-left: 50px;
	background-color:#fcccff;}



	

※★HTML
<div class="box71">BOX1(上10px、右10px、下10px、左10px)</div>
<div class="box72">BOX2(上10px、右10px、下10px、左10px)</div>

<div class="box711">BOX1(上10px、右10px、下10px、左10px)</div>
<div class="box722">BOX2(上10px、右10px、下10px、左10px)</div>
BOX1(上10px、右10px、下10px、左10px)

BOX2(上10px、右10px、下10px、左10px)
*BOX1もBOX2も画面での表示のされ方は同じ。

BOX1(上10px、右10px、下10px、左10px)

BOX2(上10px、右10px、下10px、左10px)