paddingとmarginの余白をデモで調べる方法

paddingとmarginの余白の意味や間隔をデモで見ながら確認できるサイトです。

設定が複雑で難しいCSSの設定もプレビューを見ながら直接いじれるのでおすすめです。

paddingは要素の内部の領域。marginは要素の周囲の領域。

サイト：padding – CSS: カスケーディングスタイルシート | MDN (mozilla.org)

サイト：margin – CSS: カスケーディングスタイルシート | MDN (mozilla.org)

paddingのプロパティ（数値）をいじりながら、右のプレビューで確認ができます。

引用・参考サイト

paddingのCSS

developer.mozilla.org

padding – CSS: カスケーディングスタイルシート | MDN

padding は CSS の一括指定プロパティで、要素の全四辺のパディング領域を一度に設定します。

marginのCSS

developer.mozilla.org

margin – CSS: カスケーディングスタイルシート | MDN

margin は CSS のプロパティで、要素の全四辺のマージン領域を設定します。