CSS中margin和padding的區別

2021-03-09 05:18:30 字數 2893 閱讀 5281

1樓:青鳥中關村專家

margin指的是外邊距,padding指的是內邊距。

外邊距就是指盒子與頁面之間的距離

內邊距就是內容與盒子之間的距離

上圖就把內外邊距的卻別表示出來了

2樓:每日打卡營

如上圖margin指的是外部邊距,如上圖:粉色區域。

padding指的是內部邊距。如上圖:綠色區域

3樓:好程式設計師

一、padding

1、語法結構

(1)padding-left:10px; 左內邊距

(2)padding-right:10px; 右內邊距

(3)padding-top:10px; 上內邊距

(4)padding-bottom:10px; 下內邊距

(5)padding:10px; 四邊統一內邊距

(6)padding:10px 20px; 上下、左右內邊距

(7)padding:10px 20px 30px; 上、左右、下內邊距

(8)padding:10px 20px 30px 40px; 上、右、下、左內邊距

2、可能取的值

(1)length  規定具體單位記的內邊距長度

(2)%       基於父元素的寬度的內邊距的長度

(3)auto    瀏覽器計算內邊距

(4)inherit 規定應該從父元素繼承內邊距

3、瀏覽器相容問題

(1)所有瀏覽器都支援padding屬性

(2)任何版本ie都不支援屬性值「inherit」

二、margin

1、語法結構

(1)margin-left:10px; 左外邊距

(2)margin-right:10px; 右外邊距

(3)margin-top:10px; 上外邊距

(4)margin-bottom:10px; 下外邊距

(5)margin:10px; 四邊統一外邊距

(6)margin:10px 20px; 上下、左右外邊距

(7)margin:10px 20px 30px; 上、左右、下外邊距

(8)margin:10px 20px 30px 40px; 上、右、下、左外邊距

2、可能取的值

(1)length  規定具體單位記的外邊距長度

(2)%       基於父元素的寬度的外邊距的長度

(3)auto    瀏覽器計算外邊距

(4)inherit 規定應該從父元素繼承外邊距

3、瀏覽器相容問題

(1)所有瀏覽器都支援margin屬性

(2)任何版本ie都不支援屬性值「inherit」

三、margin和padding的區別用圖表示為

在css中margin和padding作用是什麼???

4樓:匿名使用者

margin是對外bai

元素的距離,用來控du制元素本身的浮動位置zhi;margin-left:具體值dao

版; margin-bottom:具體值;

margin-right:具體值;

margin-top:具體值;

padding是對內元素,用來權控制元素內部元素的位置;

padding-left:具體值;

padding-bottom:具體值;

padding-right:具體值;

padding-top:具體值;

我給你解釋一下樓上的意思,margin是調節本身與周圍之間的距離,注意,調節的是本身

padding是調節內部元素與本身之間的距離,調節的不是本身舉個不恰當的例子吧:元素比作一隻鞋,margin是鞋與地面的距離,padding指的是腳與鞋之間的距離。

至於上下左右,我想你應該會懂了吧

5樓:懷念曾經

margin是對外bai邊距的

距du離,padding是內邊距的距離。zhi。daomargin

padding

樓主複製上面的

版**,自己看看,權

6樓:匿名使用者

margin是對外元素的距離

,用來控制元素本身的浮動位置;

margin-left:具體值版;

margin-bottom:具體值;

margin-right:具體值;

margin-top:具體值;

padding是對內元素,用權來控制元素內部元素的位置;

padding-left:具體值;

padding-bottom:具體值;

padding-right:具體值;

padding-top:具體值;

7樓:匿名使用者

盒子外面用margin,內部用padding.

8樓:僧奕聲練婉

具體值,margin是鞋與地面的距離。

至於上下左右,用來控制元素本身的浮動位置;

margin-top;

我給內你解釋一容下樓上的意思margin是對外元素的距離;

padding-bottom,用來控制元素內部元素的位置;

margin-bottom:元素比作一隻鞋:具體值:具體值:具體值;

padding-right;

margin-left:具體值:具體值;

padding-top;

margin-right,調節的不是本身

舉個不恰當的例子吧,注意,調節的是本身

padding是調節內部元素與本身之間的距離;

padding是對內元素;

padding-left:具體值,margin是調節本身與周圍之間的距離,padding指的是腳與鞋之間的距離:具體值

CSS中冒號有什麼用,求教 css中的冒號和等號使用規律是什麼?什麼時候用引號什麼時候不用?

是背景圖bai片的定位du 冒號後面的屬性可以是具體的數值zhi,可以是daoleft,right top bottom等給你個參考資料 語法內 容 background position length lengthbackground position position position 引數 l...

要在火狐和ie8中設定不同的margin top值,要怎麼

尊敬的使用者,您好!很高興為您答疑。據您的描述,您是打算實現不同瀏覽器下的css樣式區分。您可以使用hack的方式達到您的目的。box gecko核心 media all and min width 0px opera hacks 不能通過w3c css檢驗 希望我的回答對您有所幫助,如有疑問,歡迎...

CSS中簡單的DIV排列,CSS中簡單的DIV排列

我剛複製了一下,這 在ie6和搜狗2.0執行的結果是一致的沒有出現什麼問題,文字熟知的方法有以下幾種 複製來的 第一種方式輸出 我們回不去了嗎 我們還是朋友 效果圖 第二種方式輸出 writing mode設定或檢索物件的內容塊固有的書寫方向。此屬性將影響text align屬性與vertical ...