2015
09-06

CSS Margin(外邊距)

清華大佬耗費三個月吐血整理的幾百G的資源，免費分享！....>>>

CSS Margin(外邊距)

CSS Margin(外邊距)屬性定義元素周圍的空間。

Margin

margin清除周圍的元素（外邊框）的區(qū)域。margin沒有背景顏色，是完全透明的

margin可以單獨改變元素的上，下，左，右邊距。也可以一次改變所有的屬性。

可能的值

值 說明
auto 設(shè)置瀏覽器邊距。
這樣做的結(jié)果會依賴于瀏覽器
length 定義一個固定的margin（使用像素，pt，em等）
% 定義一個使用百分比的邊距

Remark Margin可以使用負值，重疊的內(nèi)容。

在CSS中，它可以指定不同的側(cè)面不同的邊距：

實例

margin-top:100px;
margin-bottom:100px;
margin-right:50px;
margin-left:50px;


Margin - 簡寫屬性

所有邊距屬性的縮寫屬性是"margin":

實例

margin:100px 50px;

margin屬性可以有一到四個值。/p>

  • margin:25px 50px 75px 100px;
    • 上邊距為25px
    • 右邊距為50px
    • 下邊距為75px
    • 左邊距為100px

  • margin:25px 50px 75px;
    • 上邊距為25px
    • 左右邊距為50px
    • 下邊距為75px

  • margin:25px 50px;
    • 上下邊距為25px
    • 左右邊距為50px

  • margin:25px;
    • 所有的4個邊距都是25px
Examples

更多實例

文本的上邊距設(shè)置使用厘米值
這個例子演示了如何設(shè)置一個使用厘米值的文本的頂部margin。

Set 使用百分比值設(shè)置文本的下邊距
這個例子演示了如何設(shè)置使用百分比值的下邊距，相對于包含的元素的寬度。

所有的CSS邊距屬性

屬性 描述
margin 簡寫屬性。在一個聲明中設(shè)置所有外邊距屬性。
margin-bottom 設(shè)置元素的下外邊距。
margin-left 設(shè)置元素的左外邊距。
margin-right 設(shè)置元素的右外邊距。
margin-top 設(shè)置元素的上外邊距。

掃碼二維碼 獲取免費視頻學習資料

編程學習