對於前端專案是css布局的基石，它主要作用是控制元素和元素之間，或者元素和內容之間的位置關係，是重要的組成部分。
乙個盒子主要有五大屬性分別為width、height、padding、border、margin。
分別含義：
width指的是內容的寬度；
height指的是內容的高度；
padding內邊距；
border邊框 ；
margin是外邊距。
盒模型是由組成：content+padding+border+margin幾大板塊組成
盒模型他也分為標準盒模型和怪異盒模型;
首先是標準盒模型：
標準盒模型的
寬度為：寬（width）+左右padding+左右border+左右margin
高度為：高（height）)+上下padding+上下border+上下margin
padding和margin作為盒模型的五大屬性，也起到了重要的作用：
1：padding的作用：用來控制父元素和子元素之間的位置關係;padding是在盒子裡面，在盒子與內容之間，他會把內容撐開，如果想讓盒子儲存原有大小，需要在原有基礎上減去，當然如果乙個元素沒有新增寬高，而是被其內容撐開的，那麼就不需要減了。
2；margin的作用：控制同輩元素之間的位置關係。margin在元素外圍，不會撐大元素的大小
3；padding和margin的寫法：他們都可以分別給單個方向或者多個方向新增；例如：padding-top/bottom/left/right和margin-left/right/top/bottom。除此之外還可以綜合來表示，我們用padding來舉例：padding:30px; 四周
padding:10px 30px; 上下 左右
padding:10px 30px 50px 上 左右 下
padding:10px 30px 50px 100px 上右下左。（margin的使用方法和padding一樣。）
從他們的寫法上看他們很相似，但是他們也各有各的特點：
padding除了上面說的會把元素撐開之外他還有padding屬性對背景是不起作用的，可以說背景的位置是不受padding值影響的，背景色會延展到padding區域。
margin不會影響元素實際寬高，但是也會影響他的所佔區域。上下兩個元素之間的margin會重疊顯示。誰的值大，就顯示誰的margin值。margin可以寫負值的，而padding不可以寫負值。
逆戰班學習 盒模型的相關介紹及作用
盒模型的概念 盒模型是css布局的基石，它規定了網頁元素如何顯示以及元素間相互關係。css定義所有的元素都可以擁有像盒子一樣的外形和平面空間。即都包含內容區 補白 填充 邊框 邊界 外邊距 這就是盒模型。作用 規定了網頁元素如何顯示以及元素間相互關係 舉個例子 content 我愛學習 paddin...
逆戰班 盒子陰影
盒子陰影 box shadow 屬性用於向盒子新增乙個或多個陰影效果。offset x 陰影的水平偏移量。正數向右偏移，負數向左偏移。offset y 陰影的垂直偏移量。正數向下偏移，負數向上偏移。blur 陰影模糊度，不能取負數。spread 陰影大小。正數陰影擴大 陰影大小大於盒子大小 負數陰影...
專案總結逆戰班 侯宇航
專案總結 看問題的角度，不能總以自己的思維去尋找答案，要多用專業名詞，有時候請教前輩會讓你換乙個思路去思考問題，適當的轉換思維往往離解決問題更進一步 2在敲 的過程中，要慢慢學會思考每一步的流程，必要的話可以使用思維導圖記下每乙個步驟，然後再寫 會讓你大腦思路變得清晰，並且更加專注。3在遇到不會的問...