外邊距佔位尺寸/盒子尺寸
版心居中
外邊距重合問題
外邊距塌陷問題
padding被撐大的問題
*
padding-top
:padding-right
:padding-bottom
:padding-left
遵循上右下左的順時針原則和後來居上原則
1>.分開寫
padding-top
:10px;
padding-right
:20px;
padding-bottom
:30px;
padding-left
:40px;
padding
:10px; 上下左右都是10px
padding
:10px 20px; 上下是10px 左右是20px
padding
:10px 20px 30px; 上10px 右20px 下30px 左10px
padding
:10px 20px 30px 40px 上10px 右20px 下30px 左10px
margin top
:margin right
:margin bottom
:margin left
:
遵循上右下左的順時針原則和後來居上原則
1>.分開寫
margin-top
:10px;
margin-right
:20px;
margin-bottom
:30px;
margin-left
:40px;
margin
:10px; 上下左右都是10px
margin
:10px 20px; 上下是10px 左右是20px
margin
:10px 20px 30px; 上10px 右20px 下30px 左10px
margin
:10px 20px 30px 40px; 上10px 右20px 下30px 左10px
盒子的佔位
:margin+border+padding+width/height
盒子的高度
:border
(上下)+padding
(上下)+height
盒子的寬度
:border
(左右)+padding
(左右)+width
div
上下 左右
版心居中:水平居中
1.盒子必須有寬度
2.盒子的顯示模式必須是塊
3.盒子的顯示模式如果是行內塊,則不生效(可通過display:line-block進行模式轉換)
當兩個含有外邊距(**margin**)的盒子相鄰時,兩個盒子的外邊距(**margin**)缺省會重合,並且兩者的距離是外邊距(**margin**)大的那個常用方案
1.超出隱藏 overflow: hidden(隱藏)**
div
.father
.son
"father">
"son">
2.新增描邊
border:1px width solid; ( 位置與第一種一樣)
3.新增空**
.clearfix:before
處理方案:冷處理
採用內減模式: **box-sizing:border-box;**使盒子佔位不變.
萬物皆檔案
程式 資料 演算法 利用演算法將規定格式的資料儲存到檔案 這就是檔案 office 是乙個典型,doc 格式，htm格式 http協議,到xml json 都是特定格式的檔案。檔案其實就是 協議，裡面儲存的內容 只有按照 規定的協議才能讀取到 不然就是乙個亂碼檔案。加密和解密也是基於這個原理 tlv...
萬物皆物件
math物件是js中的乙個內建物件,他提供了一些數學相關的屬性和方法。console.log math.pi console.log math.floor 2.999 2 console.log math.floor 2.9999 3console.log math.ceil 2.0001 3 co...
盒子模型與怪異盒子模型
所有html元素可以看作盒子，在css中，box model 這一術語是用來設計和布局時使用。css盒模型本質上是乙個盒子，封裝周圍的html元素，它包括 邊距，邊框，填充，和實際內容。盒模型允許我們在其它元素和周圍元素邊框之間的空間放置元素。下面的說明了盒子模型 box model content...