---
title: "Frontend Logs: html/css 重要ポイントメモ"
description: "学習メモ\nmargin と padding の違い"
author: "kidneyweakx"
published: 2019-03-13T00:00:00.000Z
updated: 2026-06-02T17:15:20.159Z
lang: ja
tags: ["程式筆記", "html"]
canonical: https://kidneyweakx.com/blog/19log-0313-html-note?lang=ja
alternate_zh_tw: https://kidneyweakx.com/blog/19log-0313-html-note.md
alternate_en: https://kidneyweakx.com/blog/19log-0313-html-note.md?lang=en
---

# Frontend Logs: html/css 重要ポイントメモ

### 学習メモ

> margin と padding の違い

いちばんの違いは位置
margin は外側の余白で、負の値も取れる。別名「填充」
padding は内側の余白。別名「空白辺」

<br />

> box model とは

ボックスモデル（box model）とは、border（枠線）、margin（外側の余白）、padding（内側の余白）、そして要素のコンテンツをどう扱うかを含んだ処理方式のこと。

<br />

> なぜ文字サイズは px ではなく em で指定するのか

Internet Explorer で文字サイズを調整できるようにするため
em はすべてのブラウザで文字サイズを変更できるが、px は一部のブラウザではできない
px は余白を調整するための単位

<br />

> h1 {margin : 10px 0px 15px 5px;} の margin-top、margin-right、margin-left、margin-bottom はそれぞれいくつ？

時計回りの順に並ぶ

* top 10px

* right 0px

* bottom 15px

* left 5px

### extra

* **左マージン**の値がない場合は、**右マージン**の値が使われる。

* **下マージン**の値がない場合は、**上マージン**の値が使われる。

* **右マージン**の値がない場合は、**上マージン**の値が使われる。
