border: border-width | border-style | border-color;
/* 沒有先後順序，上面是推薦順序 */
作用border-width
邊框粗細，單位px
border-style
邊框的樣式
border-color
邊框顏色
border-top:**細線邊框border-bottom:
border-collapse: collapse;
/* 表示相鄰的邊框合併在一起 */
padding-left: 20px;
padding-top: 20px;
值的個數
屬性padding: 5px;
上下左右都是5px的內邊距
padding:5px 10px;
上下為5px，左右為10px
padding: 5px 10px 20px;
上內邊距是5px，左右內邊距是10px，下內邊距是20px
padding: 5px 10px 20px 30px;
上為5px，右為10px，下為20px，左為30px按順時針順序
margin應用：塊元素水平居中
巢狀塊元素塌陷
注意：浮動的盒子不會有外邊距塌陷的問題
*border-radius: length;
/* length是圓的半徑，和矩形的兩個邊相切 */
圓角矩形：
復合屬性
分別設定：
box-shadow: h-shadow | v-shadow | blur | spread | color | inset;描述h-shadow
必需，水平陰影的位置，允許負值
v-shadow
必需，垂直陰影的位置，允許負值
blur
模糊距離
spread
陰影的尺寸
color
陰影的顏色(rgba)
inset
將外部陰影(outset)改為內部陰影
box-shadow: 0 2px 4px rgba(0, 0, 0, .2);text-shadow: h-shadow | v-shadow | blur | color;描述h-shadow
必需，水平陰影的位置，允許負值
v-shadow
必需，垂直陰影的位置，允許負值
bulr
模糊的距離
color
陰影顏色(rgba)
css盒子模型 CSS 盒子模型
css 盒子模型基本上是面試的必考題，因為實在是太重要了。以前寫 css 總是感覺元素的寬高十分難調，其中乙個很大的問題就是忽略了盒子模型的重要性。說到 css 盒子模型，你可能會說我知道呀，就是 margin 包 border,border 包 padding,padding 包 content ...
初識css之div盒子模型
說到css，就不得不說到盒子這個重要的布局模組了 所有html元素可以看作盒子，在css中，box model 這一術語是用來設計和布局時使用。css盒模型本質上是乙個盒子，封裝周圍的html元素，它包括 邊距，邊框，填充，和實際內容。盒模型允許我們在其它元素和周圍元素邊框之間的空間放置元素。不同部...
css盒子模型 說說css盒子模型
引用mdn官方的解釋 當對乙個文件進行布局 lay out 的時候，瀏覽器的渲染引擎會根據標準之一的 css 基礎框盒模型 css basic box model 將所有元素表示為乙個個矩形的盒子 box css 決定這些盒子的大小 位置以及屬性 例如顏色 背景 邊框尺寸 每個盒子由四個部分 或稱區...