Chrome外掛-Pinegrow Web Designer免費版Bootstrap視覺化開發工具

梅問題-Chrome外掛-Pinegrow Web Designer免費版Bootstrap視覺化開發工具
  先前曾分享過Pinegrow Web Designer這套網頁開發工具,不但全視覺化操控,同時可開發Bootstrap、Foundation、AngularJS...外,甚至還可開發WordPress的佈景主題,這對於設計人員來說,是件相當方便的事情,無需看著冷冰冰的原始碼,腦海裡自己勾勒出整個網頁的架構藍圖,甚至Pinegrow Web Designer這套所產生出的Bootstrap的網頁框架,右手邊還會呈現出網站的樹狀結構外,同時還可以隨時修改已建立的結構。
  而這麼好用的工具,並非免費且隨著所需的功能不同,費用也不同,但若只需使用到Bootstrap的朋友,有福啦!Pinegrow Web Designer有推出免費版,且直接掛載在Chrome瀏覽器中,直接開啟瀏覽器立即就可使用,因此有在使用Bootstrap的朋友,也趕快來安裝一下囉!
Pinegrow Web Designer:
外掛名稱:Pinegrow Web Designer
支援平台:Google Chrome
下載網址:https://chrome.google.com/

Step1
進到外掛網頁後,點一下加到CHROME鈕,就可完成安裝。
梅問題-Chrome外掛-Pinegrow Web Designer免費版Bootstrap視覺化開發工具
Step2
這隻外掛安裝完後,會放在應用程式中,接著點一下Pinegrow Web Designer的圖示。
梅問題-Chrome外掛-Pinegrow Web Designer免費版Bootstrap視覺化開發工具
Step3
開啟Pinegrow Web Designer應用程式後,點右下的OK鈕.
梅問題-Chrome外掛-Pinegrow Web Designer免費版Bootstrap視覺化開發工具
Step4
操作界面就與之前的電腦版一模一樣,畫面也是一分為三,中間可以建立新專案,或是開啟舊檔襄進行編輯。
梅問題-Chrome外掛-Pinegrow Web Designer免費版Bootstrap視覺化開發工具
Step5
建立好後,左邊欄就是所有可用的元件,點一下或拖拉到中間的工作視窗即可。
梅問題-Chrome外掛-Pinegrow Web Designer免費版Bootstrap視覺化開發工具
Step6
甚至也可編輯元件的原始碼,功能一點也沒少。
梅問題-Chrome外掛-Pinegrow Web Designer免費版Bootstrap視覺化開發工具
Step7
當編輯完畢後,點上方的File / Downlaod project Zip,就可把剛所製作的專案給下載回來。
梅問題-Chrome外掛-Pinegrow Web Designer免費版Bootstrap視覺化開發工具
Step8
接著再點對話框上方的連結,就可將專案給下載回來。
梅問題-Chrome外掛-Pinegrow Web Designer免費版Bootstrap視覺化開發工具
Step9
下載完畢,解壓縮後,就會看到所有的檔案,接著再點new.html檔。
梅問題-Chrome外掛-Pinegrow Web Designer免費版Bootstrap視覺化開發工具
Step10
立馬可用瀏覽器來檢查一下,基本上在Pinegrow Web Designer看到的畫面,幾乎與結果畫面是一致的,因此有這工具後,讓在製作RWD網頁更加的簡易。
梅問題-Chrome外掛-Pinegrow Web Designer免費版Bootstrap視覺化開發工具

相關文章

沒網路也不無聊~Google Chrome離線版限定「小恐龍」遊戲

沒網路也不無聊~Google Chrome離線版限定「小恐龍」遊戲

Chrome外掛-「Print Friendly & PDF」一鍵快速將當前網頁轉換成PDF檔

Chrome外掛-「Print Friendly & PDF」一鍵快速將當前網頁轉換成PDF檔

Google Chrome瀏覽器的網址列暗藏計算機功能,不但可加、減、乘、除還可開根號

Google Chrome瀏覽器的網址列暗藏計算機功能,不但可加、減、乘、除還可開根號

免裝軟體!打開瀏覽器,從LINE STORE隔空下載完整貼圖

免裝軟體!打開瀏覽器,從LINE STORE隔空下載完整貼圖

Chrome外掛-FireShot一鍵擷取整頁的網頁內容畫面

Chrome外掛-FireShot一鍵擷取整頁的網頁內容畫面





回應本篇 »

(姓名)*必填
(信箱)*必填
(網站)

※PS: 因梅干時間有限,教學網中所分享的主題繁多(所遇狀況也很多),可能無法一一回答各位,不便之處還請見諒。
※PS: 本教學網不提供「破解檔」、「註冊機」或「註冊碼」等資訊,請勿利用留言索取檔案。