HTML・CSS

【CSS】paddingとmarginの違いを初心者でもわかるように図解してみた

ららです。

記事の中で、こんなふうに文章を囲みたい!とします。

WS008912

ググってサンプルを元にCSSを書くんだけど、
paddingとmarginの違いが、いつまでたってもわからんのです (;´Д`)

ここにちゃんと書いとこうと思います。

paddingはここだ!

paddingが15pxの場合

WS008913
↓ ↓ ↓
WS008912

えっ、どこが15px??

paddingを100pxにしてみた

WS008914
↓ ↓ ↓
WS008915

ここだった~~~(・∀・)

marginはここだっ

marginが20pxの場合

WS008916
↓ ↓ ↓
WS008919

えっえっ?どのへんが20px?

marginを100pxにしてみた

WS008918
↓ ↓ ↓
WS008921

ここだった~~(# ゚Д゚)

以上、視覚的にわかっていただけたかと。
私も何かとここを見返そうと思います^^;

無料レポートが書けなくてもメルマガを始める方法
HAPPYな仕組みダウンロード

「メルマガを始めてみたいけど読者を集めるの大変そう…」
そんなあなたへ。努力しなくっても読者さんが集まる、目からウロコの方法を伝授します(無料です)。

>>レポートをダウンロード!

COMMENT

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です