---
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: zh-TW
tags: ["程式筆記", "html"]
canonical: https://kidneyweakx.com/blog/19log-0313-html-note
---

# Frontend Logs: html/css 重點筆記

### 學習筆記

> margin 與 padding 的差異

位置是他們最大的差異
margin 是外邊距，有負值，別稱 填充
padding 是內邊距，別稱 空白邊

<br />

> 甚麼是 box model

框模型(box model)是包含border(邊框)、margin(外邊距)、padding(內邊距)和處理元素內容的處理方式。

<br />

> 為何要使用 em 而非 px 來定義字的大小

為了在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

* 如果缺少**左外邊距**的值，則使用**右外邊距**的值。

* 如果缺少**下外邊距**的值，則使用**上外邊距**的值。

* 如果缺少**右外邊距**的值，則使用**上外邊距**的值。
