Bootstrap-Other：UI 編輯器

ylbtech-Bootstrap-Other：UI 編輯器

 

1.返回頂部

一、

Bootstrap UI 編輯器

 

如下是 15 款最好的 Bootstrap 編輯器或者是在線編輯工具。

 

1. Bootstrap Magic

這是一個 Bootstrap 主題生成器，使用最新的 Bootstrap 3 版本和 Angular JS 版本，提供一個鮮活的用戶修改預覽。它包括了各類各樣的導入，一個顏色選擇器和智能的預先輸入。更神奇的是，Bootstrap 會根據用戶的每一個選擇來從新創建框架，方便用戶的下載和使用。

2. BootSwatchr

BootSwatchr 是由 Drew Strickiand 獨立開發和維護的，是惟一支持從右到左語言顯示的 Bootstrap 自定義構建工具，這也是它的特點之一。BootSwatchr 是個可視化的工具，能夠從底層開始建立 Bootstrap 主題。

3. Bootstrap Live Editor

Bootstrap Live Editor 是個所見即所得的構建 Bootstrap 的編輯器。在 Bootstrap 準備好的內容和代碼片斷的基礎上提供一個又好又優雅的方法來編輯和美化 html，也所以它是個明智的選擇。除此以外，它還包括高級的選項好比按鈕配置，自定義標籤和爲用戶作最明智最有益的選擇。

4. Fancy Boot

Fancyboot 是個很是有用的 Bootstrap 自定義工具，容許用戶編輯 Bootstrap 的配置，自動預覽他們的修改結果。經過滑動菜單能夠選擇須要使用的插件和組件。當用戶作好了相應的修改，能夠下載一個包含用戶所使用的 jQuery 插件的編譯好的和簡化後的 CSS 文件。

5. Style Bootstrap

Style Bootstrap 是個很是棒的內置瀏覽器的 GUI 實用工具，幫助用戶自定義 Twitter Bootstrap 外觀。它很是容易進行自定義操做。從 body 風格，字體排版，按鈕，導航，格式，通知提示和其餘用戶很容易根據本身的意願自定義的元素。除了強大的自定義功能，它還能夠很容易生成可下載的 CSS 文件

。

6. Lavish

Lavish 是個幫助用戶從一個圖像中定製本身喜歡的 Bootstrap 配色方案。用戶能夠從圖像中選擇各類顏色用在 body 背景，連接，頭部，菜單，標籤，文本，下拉菜單等等元素上。一旦你肯定了 Bootstrap 配色方案，就能夠很方便的下載相應的 Boostrap.css 文件。

7. Bootstrap ThemeRoller

Bootstrap ThemeRoller 是個直觀的 web 應用程序， 提供一個可視化的界面讓用戶按照本身的風格建立屬於本身的 Bootstrap 主題。有了這個工具，用戶能夠自定義顏色，大小，字體，格式，表，按鈕，警告信息，導航條，菜單等等元素。

這個應用還會幫用戶建立的每種風格都生成惟一的一個 URL ，這樣就能夠保存用戶全部的設置。更難以想象的是，當用戶離開的時候，用戶能夠中止或者恢復本身定製的頁面。

8. LayoutIt!

LayoutIt！擁有拖拽接口的功能，能簡單迅速的構建一個 Bootstrap 前端代碼。LayoutIt！ 兼容任何的編程語言，容許用戶下載 HTML ，在這裏自由的進行編碼設計。

 9. Pingendo

Pingendo 是個可視化的桌面應用程序，容許用戶給予流行的 Twitter Bootstrap 框架建立響應式 web 頁面原型。Pingendo 還提供大量的現成的佈局，拖拽元素的位置，調整大小和自定義的功能。用戶能夠自行優化他們的頁面，插入他們本身的內容。

10. Kickstrap

Kickstrap 是個 Bootstrap UI 編輯器，使用 Firebase 做爲一個後臺服務。它無縫的接合了 Bootstrap 和頂級的 web 技術。更厲害的是，它能夠運行一個已驗證的，不須要本地後臺支持，數據庫驅動的 web 應用。

11. Bootply

Bootply 是一款很棒的 Bootstrap UI 編輯工具，儘量簡單的讓用戶編輯 Bootstrap 友好的 CSS ，HTML 和 Javascript 。同時也是一個可拖拽的可視化編輯器，用來設計，建立原型和測試 Bootstrap 框架。Bootply 有個代碼存儲庫，裏面包括了 Bootstrap 代碼片斷，示例和模板。除了以上這些，更吸引人的是它有個很是活躍的 Bootply 社區，用戶能夠很方便的發現，分享和展現相關的代碼和片斷。

12. X-editable

X-Editable 是一個擴展庫，容許用戶建立可編輯的元素，好比頁面彈出和內聯模式。她提供本地的 Bootstrap，jQuery UI 或者是純 jQuery 編輯功能。此 Bootstrap UI 編輯器擁有許多很強大的功能，包括客戶端，服務端驗證，支持鍵盤，live 事件，可定製的容器空間等等。總而言之，它提供很是快速的開發功能，易於刪除字段，一個用來更新數據的簡簡單後臺腳本。

13. Jetstrap

不要錯誤的覺得 Jetstrap 只是個簡單的實體模型工具，它是 100% 基於 web 接口的 Twitter Bootstrap 構建工具。用戶不須要下載任何類型的軟件就可使用 Jetstrap。用戶只須要登陸，而後構建本身的項目，就能夠隨時隨地進行訪問了。構建功能主要是提供給開發者和設計者的，用戶很容易就能夠經過 Jetstrap 生成漂亮的網站，並且運行速度很是快

14. DivShot

DivShot 是個快速的，可視化的前端開發文本編輯器，跟  mockup 工具同樣的簡單整潔。包括各類框架須要的各類定製的組件庫，這是它提供的最好的工具之一。除此以外還包括了一個主題轉換器，容許用戶修改主題。試驗版本是免費的，過了試驗期就須要本身付費維持原來的服務了。

 

15. PaintStrap

PaintStrap 使用 Adobe kuler/COLOURlovers 顏色組合來生成漂亮的 Twitter Bootstrap 主題。這個工具特別容易安裝，同時很容易下載 CSS 文件而且也很容易替換成另外一個標準的文件。   

二、

2.返回頂部

 

3.返回頂部

 

4.返回頂部

 

5.返回頂部

一、

http://www.runoob.com/bootstrap/bootstrap-ui-editor.html

二、

 

11.返回頂部

 

做者：ylbtech 出處：http://ylbtech.cnblogs.com/ 本文版權歸做者和博客園共有，歡迎轉載，但未經做者贊成必須保留此段聲明，且在文章頁面明顯位置給出原文鏈接，不然保留追究法律責任的權利。