CSS 盒子是 Web 頁面中的一種基本元素,用于構建頁面布局,表示顯示在頁面中的元素的位置、大小、邊框和填充等屬性。盒子源代碼由以下幾部分組成:
.box { width: 200px; /* 盒子的寬度 */ height: 150px; /* 盒子的高度 */ border: 1px solid black; /* 盒子的邊框 */ padding: 10px; /* 盒子的內邊距 */ margin: 20px auto; /* 盒子的外邊距 */ }
以上代碼定義了一個名為.box
的 CSS 類,它包含了盒子的屬性。
width
和height
屬性分別定義了盒子的寬度和高度,單位可以是像素、百分比或 em 等。
border
屬性定義了盒子的邊框,包括顏色、寬度和樣式,這里定義了一個黑色、寬度為 1 像素的實線邊框。
padding
屬性定義了盒子的內邊距,即邊框與盒子內容之間的距離,這里定義了 10 像素的內邊距。
margin
屬性定義了盒子的外邊距,即盒子與其他元素之間的距離,這里定義了上下外邊距為 20 像素,左右外邊距為 auto,即自動居中盒子。
下一篇css盒子浮動模板