CSS盒子模型之外邊距

2021-10-05 03:38:44 字數 620 閱讀 2636

外邊距:不會影響盒子的大小,但會影響盒子的位置

margin-top:

上邊距,設定乙個正值,元素會向下移動

margin-left:

左邊距,設定乙個正值,元素會向右移動

margin-right:

右邊距,設定乙個正值,下面的元素會向右移動

margin-bottom:

下邊距,設定乙個正值,下面的元素會向下移動

元素在頁面中是按照自左向右進行排列的

預設情況下,我們設定左和上外邊距將移動自身

設定右和下外邊距將移動其他元素

margin可以設定負值,表示往相反方向走

margin簡寫屬性;可以同時設定四個方向的值

會影響整個盒子的占用空間

只寫兩個值:上下外邊距/左右外邊距

值1 值2:

值1 auto

auto 值2

"box">

"box2">

css3 盒子模型之外邊距

圍繞在內容邊框的區域,就是外邊距,外邊距預設為透明區域外邊距接受任何長度單位 百分數值 設定方式和內邊距大同小異,可以分為 整體設定 margin 單側設定 margin bottom left right top 其中,還有乙個是外邊距合併的概念,如果存在兩個盒子,上面盒子的margin是50px...

盒子模型 外邊距

外邊距 margin 外邊距不會影響盒子可見框的大小 但是外邊距會影響盒子的位置 一共有四個方向的外邊距 margin top 上外邊距,設定乙個正值,元素會向下移動 margin right 預設情況下設定margin right不會產生任何效果 margin bottom 下外邊距,設定乙個正值...

盒子模型外邊距

初始化網頁元素 網頁中所有元素的內外邊距都為0 盒子水平居中 左右外邊距設定為auto。前提條件 有width。margin 0 auto 1.給相鄰兩個盒子都設定了margin時,垂直方向外邊距取兩者中的最大值 合併解決 只給乙個盒子外邊距 box1 box22.塌陷 巢狀的兩個盒子都設定了mar...