CSS中邊框的使用
屬性名稱屬性值說明
border-color十六進(jìn)制可依序設(shè)置上腕让,右孤钦,下,左線顏色
? ? ? ? ? ? ? ? ? ? 英文名稱border-color:red(四邊均為紅色)
? ? ? ? ? ? ? ? ? ? 三原色border-color:red green
? ? ? ? ? ? ? ? ? ? (上下為紅色纯丸,左右為綠色)
? ? ? ? ? ? ? ? ? ? border-color:redgreen blue
? ? ? ? ? ? ? ? ? ? (上為紅色偏形、左右為綠色、下為藍(lán)色)
? ? ? ? ? ? ? ? ? ?border-color:redgreen blue yellow
? ? ? ? ? ? ? ? ? ? ?(上右下左分別為紅綠藍(lán)黃)
?border-stylenone不顯示邊線
? ? ? ? ? ? dotted點(diǎn)線
? ? ? ? ? ? dashed虛線
? ? ? ? ? ? solid實線
? ? ? ? ? ? double雙線
border-width ? ?長 度 ? border-width:0.2cm0.3cm 0.4cm 0.5cm;
? ? ? ? ? ? ? ? ? ? ? ? ? ?border-width:12 3 4;
簡化方案:border:形態(tài) 長度 顏色
例如border:1px solid black;
CSS中邊界的使用
padding屬性介紹
屬性名稱 ? ? ? ? ? ? ? ? 屬性值 ? ? ? ? ? ? ? ? ?說明
padding-bottom ? 長度/百分比 ? 元件下端邊線的空隙
padding-left ? 長度/百分比 ? 元件左端邊線的空隙
padding-right ? 長度/百分比 ? 元件右端邊線的空隙
padding-top 長度/百分比 元件上端邊線的空隙
簡易寫法:padding:10px
? ? ? ? ? ? ? ? ? ?padding:2px 4px
? ? ? ? ? ? ? ? ? ? padding:2px 6px 10px
? ? ? ? ? ? ? ? ? ?padding:1px 2px 3px 4px
margin 系列屬性介紹
屬性名稱 ? ? ? ? ? ? ? ? ?屬性值 ? ? ? ? ? ? 說明
margin-bottom ? ? ? ? ?auto ? ? ? ? ? 自動調(diào)整空隙
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 長度/百分比 ?設(shè)置下端空隙
margin-left ? ? ? ? ? ? ? ? auto ? ? ? ? ? ?自動調(diào)整空隙
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 長度/百分比 設(shè)置左端空隙
margin-right ? ? ? ? ? ? ? auto ? ? ? ?自動調(diào)整空隙
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 長度/百分比 設(shè)置右端空隙
margin-top ? ? ? ? ? ? ? auto ? ? ? ? ? ? ? ?自動調(diào)整空隙
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 長度/百分比 設(shè)置上端空隙
簡化方案:margin:2px 4px
margin:2px 6px 10px
margin:1px 2px 3px 4px
常用網(wǎng)頁頂格設(shè)置:margin:0;