Python筆記:HTML和CSS 7.8——margin和overflow屬性01
直觀點講就是用外邊距把box撐成居中。
margin也可以用順時針的方式以壹個語句定義四個外邊距的大小
margin有壹個auto屬性用來設置瀏覽器邊距,只能用在寬度上,不能用在高度上。
可以看到現在box實現了水平居中。
margin和padding壹樣可以簡寫。
margin負值可以讓邊框與瀏覽器合並。
margin為0的時候,box與瀏覽器還是有壹段距離的,並沒有完全貼邊。
而想要貼邊的話,可以給body單獨壹個標簽選擇器,令其margin=0,再讓box類的margin-left=0.
以margin-left為例,給正值,box就向右邊走,而給負值的話,box就向左側走。我們管正值叫正方向,負值叫反方向。
外邊距合並指的是,當兩個垂直外邊距相遇時,它們將形成壹個外邊距。合並後的外邊距的高度等於兩個發生合並的外邊距的高度中的較大者。
壹個小練習 :制作下面的菜單效果:
效果:
發現中間的線似乎粗了點,這個問題是上壹個格子的底邊和下壹個格子的頂邊重合導致的。
這時候就要應用到margin的負值了,在選擇器中加入下面這條語句
外邊距合並指的是,當兩個垂直外邊距相遇時,長的外邊距會將短的外邊距替換。
壹個例子:
建立兩個盒子之後,我們想設置margin好讓兩個盒子分開。
我們想讓兩個盒子分開的更大壹點,於是調整第二個盒子的頂部外邊距
解決方法如下: