有關(guān)H5的CSS小效果：
1:背景圖生效位置的三種寫法：
1：background-origin:border-box; 邊框生效位置
2：background-origin:content-box; 內(nèi)容生效位置
3：background-origin:padding-box; 默認(rèn)位置
2:文本開(kāi)切位置的寫法：
（寫文本開(kāi)切位置時(shí)，-webkit-background-clip:text; color:rgba(0,0,0,0) 要都寫才可以）
-webkit-background-clip:text;
color:rgba(0,0,0,0); 配合使用
3:倒影的寫法：-webkit-box-reflect:below 10px -webkit-linear-gradient(rgba(0,0,0,0) 40%,rgba(0,0,0,1));
1:below 表示為：向下
2:above 表示為：向上
3:left 表示為：向左
4:right 表示為：向右
5:10px 表示為：間距（這個(gè)值根據(jù)自己需求隨便定義）
4:濾鏡的寫法：
-webkit-filter:blur(0px);
5:塊的縮放大小寫法：
resize:both;
6:縮放大小完整寫法：
resize:both; overflow:hidden;
7:文本排序的寫法：
direction:rtl; unicode-bidi:bidi-override;
8:變形的寫法：
1：transform:
a：skew(X軸值，Y軸值) 傾斜度數(shù) 單位使用（deg）
b：scale(X軸值，Y軸值) 縮放比例
c：translate(X軸值，Y軸值) 平移像素 單位使用（px）
d：rotate 旋轉(zhuǎn)度數(shù) 單位使用（deg）
2：變形樣式是從后往前讀
transform:skew(30deg,10deg) scale(2,2) translate(100px,20px) rotate(45deg);
9:旋轉(zhuǎn)控制中心點(diǎn)的寫法：
transform-origin:X軸值Y軸值;
1:left
2:Right
3:top
4:bottom
20px 20px
10:景深的寫法（用來(lái)配合3D效果）
transform:perspective(800px);
括號(hào)里的值為800-1200之間值時(shí)效果最好。
perspective:800px;
11：3d的寫法：（注意：當(dāng)寫3D效果時(shí)要加給父級(jí)，3D效果是不可以繼承的）
transform-style:preserver-3d;
12：物體的變形寫法：
transform:
1:scale X軸值 Y軸值
2:rotate X軸值 Y軸值 Z軸值
3:translate X軸值 Y軸值 Z軸值
4:skew X軸值 Y軸值
13：判斷運(yùn)動(dòng)結(jié)束后的監(jiān)聽(tīng)事件：
transitionend（要配合事件綁定使用）
obj.addEventListener('transitionend',fn,false);
14: H5里有關(guān)滾動(dòng)條的寫法 pageX pageY獲取鼠標(biāo)位置自帶滾動(dòng)距離
1:表單:
1:email
2:number
3:color
4:range
5:date
6:week
7:month
8:url
9:tel
10:search
2:表單新增屬性
1:required 必填
2:pattern 里面放正則
3:step 一次加幾個(gè)
4:placeholder 提示文字
5:autofocus 自動(dòng)獲取焦點(diǎn)
6:autocomplete
on 開(kāi)啟提示文字
off 關(guān)閉提示文字
7:title 改變提示框提示文字
15:序列化:
1:{a:1,b:5} 不標(biāo)準(zhǔn)格式
2:序列化 變成標(biāo)準(zhǔn)格式j(luò)son
JSON.stringify(json)
16:反序列化
1:JSON.parse(json) 把字符串轉(zhuǎn)成正常json格式
交互解析字符串一共三種方法
1:parse
2:eval
3:new Function('return abc');
