對于前端工程師來說，Bootstrap再熟悉不過了族铆。如今Bootstrap的運用越來越廣泛了，因為它帶來了新的設(shè)計革命哭尝，使得設(shè)計以及開發(fā)變得更加的方便以及簡單哥攘。基于此材鹦，W3Cschool小師妹將為大家?guī)?0款Bootstrap 設(shè)計工具逝淹，2017年你絕對不能錯過!
設(shè)計工具一：X-editable
原文：
譯文：
通過這款設(shè)計工具，你可以在頁面上對可編輯的一些元素進行創(chuàng)建桶唐。X-editable可以使用非常多的引擎栅葡，像jQuery、jQuery-UI尤泽、Bootstrap等欣簇。不僅如此，Bootstrap有兩種模式坯约，包括內(nèi)聯(lián)模式以及彈出模式熊咽。
設(shè)計工具二：Layoutlt
原文：
譯文：
這個在線工具，這款在線工具搭建Bootstrap響應(yīng)式的布局時闹丐，可以快速且簡單的完成横殴。而且這些操作相當(dāng)簡單，都是通過使用拖動的方式卿拴。此外衫仑，元素的集成基本上是基于Bootstrap梨与。因此，Layoutlt對于前端開發(fā)者以及Web設(shè)計師而言文狱，相當(dāng)方便快捷粥鞋。
設(shè)計工具三：Grid Displayer
原文：
譯文：
這個小工具可以顯示Foundation以及Twitter Bootstrap網(wǎng)格，亦可被使用在Firefox以及基于Webkit中瞄崇。
設(shè)計工具四：Jetstrap
原文：
譯文：
Jetstrap是可視化的一個制作工作陷虎，它針對Bootstrap框架二建成。設(shè)計師以及Web開發(fā)者要想制作出一個漂亮網(wǎng)頁杠袱，只需要在網(wǎng)頁端拖曳所有組件尚猿。而利用Jetstrap這個工具所制作出來的那些網(wǎng)頁，完全符合Bootstrap的標(biāo)準楣富。如果電腦端頁面設(shè)計好凿掂，那么將自動適配Pad端以及手機端。
設(shè)計工具五：Divshot
原文：
譯文：
Divshot這個在線的網(wǎng)站纹蝴，它允許開發(fā)人員設(shè)計Web界面時庄萎，通過可視化的方式來進行，并且將直接生成CSS以及HTML代碼塘安。Divshot提供了比較常用的一些Web UI組件糠涛，那些框架的創(chuàng)建，都是基于Bootstrap框架兼犯。它生成的一個界面忍捡，也是基于Bootstrap框架所運行。
設(shè)計工具六：Bootply
原文：
譯文：
運用Bootply這個工具切黔，非常輕松的就基于Bootstrap來設(shè)計以及開發(fā)原型砸脊、擴展測試。除此以外纬霞，Bootstrap還有個很強大的功能凌埂，那就是可以和其他比較流行的庫、微框架诗芜、Bootstrap插件等整合瞳抓。
設(shè)計工具七：Bootstrap Magic
原文：
譯文：
這是一款主題創(chuàng)建的工具，它基于AngularJS以及Bootstrap伏恐。運用Bootstrap Magic孩哑，開發(fā)人員可以對自己的Twitter Bootstrap主題進行創(chuàng)建，還可以看到內(nèi)容發(fā)生了什么變化脐湾。除此以外臭笆，Bootstrap Magic還可以添加那些來自Google Webfont 的網(wǎng)頁字體。
設(shè)計工具八：Font Awesome
原文：
譯文：
你可以像修改文字樣式那樣來修改圖標(biāo)樣式秤掌。
Font Awesome是圖標(biāo)字體愁铺，只要網(wǎng)頁當(dāng)中可能用到的圖標(biāo)，它都囊括闻鉴，它專門為Twitter Bootstrap而設(shè)計茵乱。這些圖標(biāo)的顯示，是通過Web Font方式孟岛，它還可以任意改變顏色以及縮放瓶竭。要是你想修改圖標(biāo)的樣式，可以像文字樣式的修改方式那樣去操作渠羞。
上面W3Cschool小師妹為大家收集的八款Bootstrap 設(shè)計工具斤贰，它們的功能都非常棒，可以幫助開發(fā)者構(gòu)建想要的應(yīng)用次询。無論你想要漂亮的客戶端頁面荧恍，還是滿意的訪問者，Bootstrap 設(shè)計工具都可以幫你辦到屯吊。還等什么送巡，趕快收藏吧!
