基礎paddingとは|HTMLでの余白のことpadding(パディング)とは、HTMLでの余白を指します。margin(マージン)も余白のことをさしますが、指し示す場所が違います。paddingとmarginは、どちらも要素周辺のことを指しますが、paddingは内側の余白、marginは外側の余白を指すという違いがあります。HTMLの「padding」と「margin」どう覚えたらいい?考え方は?HTMLの「padding」と「margin」は、ボックス要素のどこを変更したいかで覚えるのがおすすめです。外側がmargin、その内側がpaddingなので、要素と要素の間に隙間を作りたい場合は、marginを選択します。逆に、要素と要素の間を変更せずに、内側に余白をとる場合は、paddingを使用すると覚えるのが良いでしょう。別々の数字で上下左右を指定する場合paddingで上下左右を別々に指定する場合「top」「bottom」「left」「righ」で指定することができます。上は5px、下は6px、左は7px、右は8pxで設定したい場合、以下のように記載すれば設定できます。CodePen.もしくは、下記のように記載しても設定が可能なので、覚えやすい方法で記載するのがおすすめです。上下左右同じ感覚で空白を開けたい場合は、一括で設定ができます。具体例は以下に記載してあるので、参考にしてください。上下・左右で同じ余白を開けたい場合「top」「bottom」「left」「righ」でそれぞれ数値を指定して設定することも、もちろん可能です。以下のように記載することでも設定が可能なので、やりやすい方法で記載するのが良いでしょう。上・下・左右で、それぞれ余白を開けたい場合は、「top」など4つを指定して空白を開けることも可能です。三か所の数値を入力するだけでも、設定ができるので、参考にしてください。paddingで使用できる単位は、割合を示す値か絶対値の数字で設定が可能です。割合で記載する場合width、絶対値の場合10pxなどで設定できます。割合(%)で指定する場合は、要素のサイズと外側のサイズの合計を100%以下にする必要があるので、注意しましょう。