免費資源－《JS Bin》線上網頁編輯器支援即時結果預覽
2013/05/06
之前分享過，將Google Chrome瀏覽器，變成網頁編輯器，雖然說支援的程式語法相當多，但只能用來暫存原始碼，無法預覽結果畫面，得放到實際的環境上才能知道結果，而梅干最近發現一個很棒的線上版網頁編輯器，不但支援html、css，甚至還支援javascript與嵌入jquery元件，同時還可即時預覽結果畫面，因此有時候在網路上找到一些範例檔，就可透過這個線上版網頁編輯器，直接進行測試與修改，完全不用再開啟記事本、Dreamweaver或網頁編輯軟體進行測試，目前這個線上版的網頁編輯器，只支援前端的程式，但對於一般的網頁設計來說，已相當足夠了。
線上網頁編輯器：
進入網站後，上方的HTML、Output頁籤，呈現反藍狀態，表示為開啟，這時下方的畫面會一分為二，左為html原始碼，右為結果畫面。
若要設定CSS，只要將上方的CSS頁籤點一下，開啟後把樣式直接放到CSS的欄位中，最右邊的畫面，就會顯示套用的結果畫面。
當要寫jQuery外，除了將Javascript頁籤開啟外，還得點一下Add library將jQuery的元件給加進來，才能使用喔!
寫完後，透過右邊的畫面，就會即時顯示結果啦!是不是超方便的呀!
※如有發現掉圖或檔案無法下載，請由回應區留言告知，將會盡速處理！謝謝。
※本站採用CC授權請勿全文轉貼本站文章，歡迎「部份引用」與介紹，並註明出處，謝謝。
※本站採用CC授權請勿全文轉貼本站文章，歡迎「部份引用」與介紹，並註明出處，謝謝。
回應本文