margin :外邊距可以改變盒子和盒子之間的距離,
在進行布局時,遵循以下原則, 從上往下 從左往右
設定margin-top會將盒子自身往下推
margin-bottom會將與其相鄰同級元素向下推,一般我們在布局同級元素之間優先使用margin-top來按照從上往下的原則進行樣式設定
設定margin-left會將盒子自身往右推
設定margin-right會將盒子同行排列的同級元素
向右推,一般我們在設定布局時優先使用margin-left
同級關係時,垂直方向上兩個盒子之間的margin會重疊
水平方向上兩個盒子之間的margin會疊加
巢狀結構中:子級通過margin來改變自己
相似父級中的位置中,margin-left指的是自己的左側
外邊框,到父級的內容區域左邊之間的距離,其他方向的距離都是子級的邊界到父級內容區域邊界之間的距離
當父級沒有明確的上邊界時(border padding),那麼該父級下的第乙個子級,其margin-top就會傳遞給父級,導致父級帶著子集一起向下移動,解決方案:為父級設定明確邊界,border/padding
一般現在專案中,如果我們希望子級和父級之間有一定間隙,優先使用為父級設定padding來解決,防止margin-top傳遞問題發生
margin外邊距合併
之前遇到了乙個問題 title 無標題文件 styletype text css body div body div 這是外邊距合併造成的問題。外邊距合併指的是，當兩個垂直外邊距相遇時，它們將形成乙個外邊。合併後的外邊距的高度等於兩個發生合併的外邊距的高度中的較大者。body和div的上外邊距合併了...
外邊距margin 合併
這是個基礎的問題，我們在普通文字流中布局時常常發生外邊距合併的情況 有時不太注意就會造成頁面的怪異表現，因此要掌握外邊距margin疊加合併的知識點 外邊距合併指的是 當兩個垂直的外邊距相遇時，它們將形成乙個外邊距 合併後的外邊距的高度等於兩個發生合併的外邊距的高度中的較大者 當乙個元素出現在另乙個...
margin 外邊距合併問題
外邊距合併指的是，當兩個垂直外邊距相遇時，它們將形成乙個外邊距。合併後的外邊距的高度等於兩個發生合併的外邊距的高度中的較大者。外邊距合併 疊加 是乙個相當簡單的概念。但是，在實踐中對網頁進行布局時，它會造成許多混淆。簡單地說，外邊距合併指的是，當兩個垂直外邊距相遇時，它們將形成乙個外邊距。合併後的外...