前端切圖入門：
切圖+碼**
用photoshop
會產生大量快取
先改變快取盤路徑，預設單位的修改px
ps預設：
工具，標尺，圖層，資訊，字元
用標尺可以更好的裁剪，1畫素之間也不行
切片工具可以實現快速生成多個，但不是很適合
切好生成png格式，取名要有意義
吸取顏色獲取rgb
css雪碧 即csssprite，也有人叫它css精靈，是一種css影象合併技術，該方法是將小圖示和背景影象合併到一張上，然後利用css的背景定位來顯示需要顯示的部分。
該使用css background和background-position屬性渲染，
優點：
1.減少載入網頁時對伺服器的請求次數
2.可以合併多數背景和小圖示，方便在任何位置使用，這樣不同位置的請求只需要呼叫乙個
3.提高頁面的載入速度
不足：
css雪碧的最大問題是記憶體使用
除非這個雪碧是被非常小心的組織，你就會最終使用大量的無用的空白。
影響瀏覽器的縮放功能，瀏覽器就需要做一些額外的工作來糾正這些邊緣的行為
切圖的優化
3s時間，網頁載入3s還不出來使用者基本上會關閉，所以數量要適度
顏色代替
雪碧圖的製作
字型圖示的使用
快捷鍵的使用：
刪除圖層delete
ctrl+e合併圖層
v移動c裁切
切圖輔助工具：
markdown
tinypng
前端自動化
前端小工具
小工具 1 button 2 導航條 滾動到一定高度隱藏 固定導航條 3 配色 4 webpack 5 typescript 6 react 8 yarn 9 npm 10 vue 11 gulp 12 sass 13 less 14 zepto.js 15 chart.js 16 datetime...
前端實用小工具
1 型別判斷 判斷 target 的型別，單單用 typeof 並無法完全滿足，這其實並不是 bug，本質原因是 js 的萬物皆物件的理論。因此要真正完美判斷時，我們需要區分對待 很穩的判斷封裝 let class2type array date regexp object error split ...
前端實用小工具
1 型別判斷 判斷 target 的型別，單單用 typeof 並無法完全滿足，這其實並不是 bug，本質原因是 js 的萬物皆物件的理論。因此要真正完美判斷時，我們需要區分對待 很穩的判斷封裝 let class2type array date regexp object error split ...