CSS盒子模型基礎屬性
阿新 • • 發佈：2021-11-08
一、基礎屬性
盒子模型：將HTML頁面中的元素看作是一個矩形盒子，也就是一個盛裝內容的容器。每個元素都由元素的內容（content）、內邊距(Padding)、外邊距(Margin)和邊框(Border)組成
不同部分的說明：
content(內容)：盒子的內容，顯示文字和影象。
border(邊框)：圍繞在內邊距和內容外的邊框。
padding(內邊距)：清除內容周圍的區域，內邊距是透明的。
margin(外邊距)：清除邊框外的區域，外邊距是透明的。
通過對盒子模型的屬性對段落文字進行控制：
二、邊框屬性
| 設定內容 | 樣式屬性 | 常用屬性值 |
| 邊框樣式 | border-style:上 右 下 左（上 ，左右 , 下）（上下 , 左右）（上下左右） | 畫素值px |
| 邊框寬度 | border-width:上 右 下 左（上 ，左右 , 下）（上下 , 左右）（上下左右） | 顏色值、rgb(r,g,b)、rgb(r%,g%,b%)、英文名稱。 |
| 邊框顏色 | border-color:上 右 下 左（上 ，左右 , 下）（上下 , 左右）（上下左右） | |
| 綜合設定邊框 | border:四邊寬度 四邊樣式 四邊顏色 | |
| 圓角邊框 | border-raidus：水平/垂直半徑引數 | 畫素或百分比 |
| 圖片邊框 | border-images:圖片路徑 邊框寬度/裁切方式/邊框擴充套件距離 重複方式； |
ps：具體事宜：圖片對照就ok了