CSS之內外邊距

一、概述

我們來說說標籤的內外邊距，內邊距(padding),外邊距(margin)，我們先來看看這個標準的盒子模型吧，如圖所示：

二、外邊距

說明：我們外邊距用margin樣式來表示。外邊框可以理解為，邊框的擴充套件還需要占用多大的空間，也是上、下、左、右，分別是margin-top，margin-bottom，margin-left，margin-right。當然如果直接用margin的話，那外邊距的擴充套件，上下左右都都會產生變化。

小蘇蘇

然後我設定margin-top值之後：

裡面的div和外面的div產生了上下產生了邊距，隨著我的margin-top的值不斷擴大，則邊距也越來越大：

行外邊距只的是本身的div沒有高度和寬度沒有變化，只是離父標籤的高度有變化。

margin: 10px;  #上下左右邊距都是：10px

margin: 0 10px;   #上下邊距：0，左右：10px
margin: 0 10px  0 10px; #上：0 ,右：10px  ,下：0，左：10px

小蘇蘇

然後我設定padding-top值之後：

其實div自己本身的高度沒有變大,用的是拉長自己的邊距。

padding: 10px;  #上下左右邊距都是：10px

padding: 0 10px;   #上下邊距：0，左右：10px
padding: 0 10px  0 10px; #上：0 ,右：10px  ,下：0，左：10px

CSS中的內外邊距

css中的內邊框 css中邊框與內容之間的間距叫作css的內邊距。css的內邊距可以通過padding進行修飾。padding簡寫屬性在乙個宣告中設定所有內邊距屬性 auto length 通過使用下面單獨的四個屬性可以分別設定上，下，左，右內邊距。padding top padding butto...

css盒模型。邊框和內外邊距

css盒模型 外邊距 邊框 內填充 內容 盒模型分為兩種 標準盒模型 怪異盒模型 ie盒模型 邊框 border border 10px solid blue 表示設定10畫素藍色實線條的邊框 是以下三個樣式的復合語法 border width 10px 設定邊框的寬度 border color b...

Python學習第66天（css內外邊距）

今天聽這個css課程，感覺這個老師真的講的很爛，明明可以很輕鬆理解，非得扯上一堆的if什麼的，明明很容易就能理解，硬生生給我說懵了。內外邊距倒是蠻有意思的 內邊距，自然就是塊級標籤自己內部的一些距離，然後外邊距，就是標籤和同級標籤之間的距離 margin 用於控制元素與元素之間的距離 margin的...