border-style : dashed ;邊框線為虛線
border-style : solid ;邊框線為實線
例:box-shadow:10px 10px 10px pink;
box-shadow:水平 垂直 模糊度 顏色;
盒子陰影的引數:
1)水平
2)垂直
3)模糊度
4)陰影尺寸
5)陰影顏色
6)陰影位置 (inset內陰影)
border-radius:10% /10px; 正圓佔比必須一半以上
邊框線的粗細:上 右 下 左 ;
1、border-top-width
2、border-right-width
3、border-bottom-width
4、border-left-width
邊框線的顏色:上 右 下 左 ;
1、border-top-color
2、border-right-color
3、border-bottom-color
4、border-left-color
① 上 . 右 . 下 . 左
② 上下 . 左右
③ 上 . 左右 . 下
④ 僅乙個值,代表四個方向
margin : 0 auto ; 自動居中
內容盒子:content-box
padding 和 border不占有原有的高度和寬度
邊框盒子:border-box
padding 和 border 都包含在固有的寬度和高度內
box-sizing
——內容 ->標準
——邊框 - >怪異
CSS 盒子模型 邊距合併
css外邊距合併,只有上外邊距和下外邊距才會觸發外邊距合併,左外邊距和右外邊距不會。源 div1 div2 執行效果如下 div1和div2 根據盒子模型的計算規則,div1下邊距100px和div2上邊距100px,理論應該是200px。實際css規則是合併的,因此div1和div2 之間的距離為...
CSS 之盒子模型 邊框 內邊距 外邊距
使用width來設定盒子內容區的寬度 使用height來設定盒子內容區的高度 width和height只是設定的盒子內容區的大小,而不是盒子的整個大小,盒子可見框的大小由內容區,內邊距和邊框共同決定 為元素設定邊框 要為乙個元素設定邊框必須指定三個樣式 border width 邊框的寬度 bord...
盒子邊框 外邊距 內邊距 盒子模型的尺寸
1.盒子模型由 網頁內容content 邊框boder 內邊距padding 外邊距margin 四部分組成 2.邊框boder 三個屬性 顏色color 粗細width 樣式style 01.color 分開設定boder top color上邊框顏色 boder bottom color下邊框顏...