【譯】你不知道的 Chrome 除錯工具技巧 第十一天：style editors continued（樣式編輯器後續）
特別宣告
本文是作者 Tomek Sułkowski 釋出在 medium 上的一個系列。據作者透露一共有 24 篇，一直更新到 12 月 24 日
版權歸原作者所有。
作者在Twitter上推薦我們的中文翻譯啦,截圖在最後
譯者在翻譯前已經和作者溝通得到了翻譯整個系列的許可。
為了不影響大家閱讀，許可的記錄在這裡
正文
在馬上就要迎來假期的這 24 天裡，我將會發布一系列短篇的文章，關於如何將開發工具使用得更加有意思，昨天我們和custom formatters 玩得很開心 ，今天我們用...進行一些視覺操作
30. Shadow editor 陰影編輯器
聽起來很不吉利(譯者注：陰影哪裡不吉利了！)，但是它也只是一個小部件而已，就像我們在其他的日子聊過的 Style 面板中點選在靠近 box-shadow屬性 或者 text-shadow屬性 的陰影方形符號來開啟它：
31.Timing function editor 定時函式編輯器
也成為 Cubic bezier (貝塞爾)編輯器。貝塞爾曲線是一串用來定義 CSS 的動畫速度在整個動畫過程中如何變化的魔法曲線。我們將其定義為 transition-timing-function 或者 animation-timing-function CSS 屬性。
就像之前說的 Color picker 和 Shadow editor
trasition, animation - 請注意：如果timing 函式的值沒有設定在這個簡寫的形式中，這個符號不會顯示出來)邊上的曲線符號：
順帶說一句，如果你沒有試過 3D 動畫，那很簡單：直接在容器元素中設定一個
perspective屬性。在這種情況下，我在body元素中設定了perspective: 200px;
插入樣式規則的按鈕
當你把滑鼠放在樣式選擇器的選擇區域的最後時，你會看到一系列的按鈕，他們可以讓你快速的使用 Color 和 Shadow 編輯器新增 CSS 屬性：
text-shadowbox-shadowcolorbackground-color
...開啟相應的編輯器：
今天的分享就到這裡~
慣例： 如果你從這裡學到了一些新東西
→ 你可以點個贊再走嘛~
→ 關注我：Twitter：Tomek Sułkowski
其他系列
其他此係列的文章，馬上就會翻譯出來，到時會貼出對應的連結在此處。
- 【譯】你不知道的 Chrome 除錯工具技巧 第一天：console 中的'$'
- 【譯】你不知道的 Chrome 除錯工具技巧 第二天：copying & saving
- 【譯】你不知道的 Chrome 除錯工具技巧 第三天：console methods
- 【譯】你不知道的 Chrome 除錯工具技巧 第四天：the Elements panel（元素面板）
- 【譯】你不知道的 Chrome 除錯工具技巧 第五天：console 的 log 中,讓人疑惑的案例
- 【譯】你不知道的 Chrome 除錯工具技巧 第六天：command 選單
- 【譯】你不知道的 Chrome 除錯工具技巧 第七天：非同步 consle 的趣味小竅門
- 【譯】你不知道的 Chrome 除錯工具技巧 第八天：Color picker（顏色選擇器）
- 【譯】你不知道的 Chrome 除錯工具技巧 第九天：給 console 計時
- 【譯】你不知道的 Chrome 除錯工具技巧 第十天：custom formatters（自定義格式轉換器）
- 【譯】你不知道的 Chrome 除錯工具技巧 第十一天：style editors continued（樣式編輯器後續）
寫在最後
如果你對我的翻譯表示肯定，也可以關注我一波哦~ 順便我的開源專案，求一波 star→ 看這裡, 美麗的部落格系統