outline:2px black solid
outline-offset:10px

輪廓: 位于邊框邊緣外圍的線
offset: 讓輪廓向外偏移10px畫

定位方式，取值如下
static: 靜態，不受top等設置影響，出現在正常流中
fixed: 相對瀏覽器窗口是固定的，即使窗口滾動它也不動
relative: 相對于其正常位置
absolute: 相對于其父元素，不占空間

position:absolute;
z-index:-1;

與文檔流無關，不占據空間
z-index指定堆疊順序，相當于z軸

background: linear-gradient(方向/角度,顏色1,顏色2,...);
background: radial-gradient(方向/角度,顏色1,顏色2,...);

方向: to bottom、to top、to right、to left、to bottom right
角度: 從12點方位順時針增加
設置背景顏色漸變，線性、

none: 不顯示（不占空間）
block: 塊元素
inline: 內聯元素

visible: 可見
hidden: 不可見（仍占空間）
collapse: 和hidden效果類似

border: 30px solid transparent;
border-image-source:url("1.jpg");
border-image-slice:20 20 20 20;
border-image-width:10 10 10 10;
border-image-outset:1 1 1 1;
border-image-repeat:repeat/sterch

border:邊框
source:邊框圖像地址
slice:4個值代表4條線距邊的位置
width:邊框圖片寬度
outset:圖片延伸到元素盒子的大小
repeat:圖片擴展方式重復/拉伸

列表標記的圖片

blur(2)高斯模糊為2
grayscal(10%)轉換成10%的灰度圖...

指定不透明度
從0.0(完全透明)到1.0(完全不透明)

圖像拼合技術，從圖的某個位置開始截取一部分
0 0: 指定從圖片左、上開始的位置

transform: 變形轉換屬性。
讓某個元素改變形狀，大小和位置
roate(): 2D轉換方法，旋轉

div{
width:100px;
transition-property:width;
transition-duration:2s;
transition-timing-function:linear;
transition-delay:2s;}
div:hover{width:300px;}

transition: 過渡，從一種樣式轉變到另一個時，
無需使用Flash動畫或JavaScript
鼠標移動到div上，它的寬度(property)從100逐漸變到300
timing-function: 隨時間變化速度變化
變化持續時間(duration): 2s
變化開始時間(延遲delay): 2s

?div{
animation: myAnimation 5s;}
@keyframes myAnimation{
0% {background:red;}
25 {background:yellow;}
100%{background:blue;}}

?animation: 動畫名稱 持續時長
@keyframes規則，myAmimation動畫名稱
0%->100%指定變化發生的時間
變化完成后回到0%的情況

表格中相鄰單元格的邊框間距離
僅用于"邊框分離"模式

指定元素內的空白怎樣處理

width(寬) + padding(內邊距) + border(邊框) = 實際寬度
height(高) + padding(內邊距) + border(邊框) = 實際高度

overflow:auto;
resize:both|horizon|vertical;

需設置overflow
resize:允許用對元素大小進行手動調整

box-sizing:content-box|border-box

指定width/height設置的目標為內容盒子|邊框盒子

column-count:3;
column-span:1|all;
column-gap:5px;
column-width:10px;
column-fill:auto|balance;
column-rule-color:#000000;
column-rule-style:solid|dotted;
column-rule-width:10px

column將元素分成多列（欄）顯示
count: 列數
span: 跨1或所有列
gap: 兩列的間距
width: 列的寬度
fill: 填充方式自動或盡量列長平衡
column-rule: 列與列之間的線的設置

div{font-size:10px;}

p{font-size: 1.5em;}

p的字體大小

1.5*p的最近父元素的font-size

p{font-size: 8vm;}

p{font-size: 8vh;}