【變身】將Google Chrome瀏覽器變成 臨時網頁語法編輯器(包括html、css、js、php...)

有時候，對非專業工程師但有時會coding的人來說，靈感一來或網上看到一段需要的程式碼，
臨時要找個Java jdk、dev c++等程式去寫是十分不方便的，如果你說，貼到記事本不就好了？
但，將一些還沒用到的原始碼，暫時先貼到記事本中，等要用到時，再一一轉貼，雖然記錄
了要用的程式碼，但看到純文字模式黑鴨鴨一片的程式碼，還真令人眼花 @_@..

不過大家上網一定會用到瀏覽器，那若把Google Chrome瀏覽器變成臨時的網頁編輯器，
無論是html、css、javascript等網頁程式語法都可以暫存，同時還會依照不同的程式碼變換顏色，
不同判斷式、框架等幫你做欄位區隔，不是非常方便嗎！至於要怎麼用，就一起來看看！

第一步
用Chrome開一個網頁，接著將下方參數程式碼↓輸入(貼上)到網址列，就會進到空白的編輯器。而這個空白的編輯器也可以直接加入我的最愛，作為一個網頁連結，以後要用時就不用再貼參數，只要點一下已存的書籤就好了。

data:text/html, <style type="text/css">#e{position:absolute;top:0;right:0;bottom:0;left:0;}</style><div id="e"></div><script src="http://ajaxorg.github.io/ace-builds/src-min-noconflict/ace.js" type="text/javascript" charset="utf-8"></script><script>var e=ace.edit("e");e.setTheme("ace/theme/monokai");e.getSession().setMode("ace/mode/ruby");</script>

第二步
將此編輯器改成你要的程式語言，如果你要記錄的是php語法，就將編輯器改成php紀錄，
而改動的方法很簡單，將上一步參數中紅色的部分setMode("ace/mode/ruby")，
最後的ruby修改成所需的的語言就可以了，例如：

Markdown ： 'ace/mode/markdown' Python： 'ace/mode/python' C/C++ ： 'ace/mode/c_cpp' Javscript： 'ace/mode/javascript' Java： 'ace/mode/java' Scala： 'ace/mode/scala' css, html, php, latex, tex, sh, sql, lua, clojure, dart, typescript, go, groovy, json, jsp, less, lisp, lucene, perl, powershell, scss, textile, xml, yaml, xquery, liquid, diff and many more.

光說不如馬上行動，隨便貼個html原始碼試看看，Yo~不但原始碼會變色，且左邊還有原始碼行數，有了行數，寫程式真如虎添翼阿。不過缺點是，如果同一行程式過長，無法自動換行就是了 0_0

Over ~

Posted in: 網站設計, 網路發現