近期在嘗試用bootstrap做移動端開發，發現了一些問題，這裡寫下自己的一些想法與疑問？

01-09

首先對於移動端來說載入bootstrap的js css本身就比較笨重，再一個就是bootstrap本身對移動端布局的支持就比較局限，只是基於它自己的那套風格，比如一個div 你設置寬高都是200px,在不同屏幕下包括pc 它的寬高還是200px根本不會放大縮小，如果用rem那我乾脆再加上media query 幹嘛還要用bootstrap。bootstrap在移動端開發特別是精確的布局上面個人感覺還是存在很多問題。
最近興起rem+media query 做移動端開發，我也做過一個項目用的這種方案，確實不錯，在移動端開發頁面布局兼容上確實比較好。而且輕量。bootstrap的響應式布局也是基於這種媒體查詢的方案。
感覺如果是純粹的移動端開發是不是要放棄bootstrap，或者是bootstrap的重點不是在移動端，而是在pc

你之所以有這些疑惑，可能是前端工程的經驗不夠以及對 Bootstrap 的理解不夠深。

首先，我們來看你所認為的「笨重」。這是我剛剛下載的 bootstrap：

bootstrap.js - 68954 bootstrap.min.js - 36868 bootstrap.min.js.gz - 9781

bootstrap.css - 146082 bootstrap.min.css - 121260 bootstrap.min.css.gz - 19765

我們可以看到未壓縮前的 JS 代碼也不到 70KB，未壓縮的 CSS 也不到 150KB。加起來不到 220KB 的東西，實際上只是 4G 網路中一秒不到的大小而已。

當然，你覺得還是很大，那咱們 uglify 一下，再 gzip 一下呢？JS 文件只剩 10KB 不到，CSS 只剩 20KB 不到，加起來不到 30KB，這還是很笨重嗎？

再來看看你說設置 200px 之後它不會縮放，我覺得這就很蛋疼了，為什麼你會覺得你設置了它是 200px 之後，還應該在小屏幕下變小呢？

實際上，要在工程中使用 Bootstrap，不應該是使用它編譯後的文件，而是使用它編譯前的 less/sass 代碼，然後通過修改它的變數，來達到自定義它的樣式。並且，自己定義一套引入模塊的代碼，僅僅把你需要用到的模塊引進來。

並且，你說「精確的布局」實際上你可以自己通過上述的方式去定義一套樣式，並且讓你的設計師盡量按照你們的 UI 來設計，而不是追求那種不正常的「精確」。

我們計蒜客上一版 UI 的底層就是 Bootstrap 的，Bootstrap 開源社區有人開發了一個叫 Bootflat 的 UI，我們在 Bootflat 上面再封裝了一層適合我們使用的 UI，我們稱為「JisuankeUI」：

（備註：這是以前一位實習生寫的，現在因為已不再使用了，所以沒有人維護，不建議大家使用）雖然說現在提倡組件化，大家都玩 Vue、React 什麼的了，Bootstrap 已經開始有點落後了。但是 Bootstrap 還是一套經典的 UI 框架，裡面有很多東西值得去研究和挖掘的，要明白一個東西能流行這麼多年，一定是有它的價值的。

題主……如果你長寬都設置成200px，如何期望它能有響應式變化……

Bootstrap提供了一套比較成熟的框架，並且擁有一些基礎JavaScript功能：Alert，Tooltip和Collapse等等。總之用起來就是方便，建站也迅速。

至於Media Query……首先它不是最近興起的; 其次確實，在Bootstrap3里也已經用到：

CSS · Bootstrap &<-- 官網介紹

那麼為什麼要用Bootstrap？

【1】方便

【2】方便

【3】確實方便

具體可以看這裡 --&> Bootstrap3正式版發布！

就我個人感覺，如果題主追求樣式的個性化。如果有專門的設計團隊，那沒問題；如果沒有……我覺得你會想念Bootstrap

如果不用Bootstrap，有沒有替代品？

看這裡 --&> Ratchet

看這裡 --&> http://purecss.io/

看這裡 --&> Foundation | The Most Advanced Responsive Front-end Framework from ZURB

看這裡 --&> YAML CSS Framework

看這裡 --&> Skeleton: Responsive CSS Boilerplate

你可知，真正的純移動端大型應用，是沒有人用bootstrap的。。。

如果你非要用框架，請用純移動端的框架。

響應式頁面開發是可以用的，純粹足做移動端就顯得太笨重。可以選用純粹的移動端框架framwork7之類的產品

接收的好幾個項目中有拿bootstrap的，結果拿過來狂覆蓋，最先開始用的人不知道有個定製嗎？？？？？看著就煩人

Bootstrap是個經典的響應式框架，但它不一定適合你的項目。

你需要去改造它，或者和其他各種插件結合，甚至研究它的源碼寫出自己的更適合移動端的框架。

移動端我覺得Frozen. js挺好的。

我只會拿bootstrap的mixin來參考或用一下，其他的確實不太適合生拉硬套

bs剛出來的時候用過，感覺還挺方便，但後來完全沒有一點興趣，一是沒必要用到所有的組件(雖然可以自定義選擇組件，但是感覺還是不精簡)，二是全世界很多人都在用這套設計，有厭倦感，假如要基於bs去重新定義顏色或者更改設計，又很難跳出那個框。做技術類項目文檔用bs我感覺還挺適合的，但是牽涉到一些需要有特色的，需要與眾不同的就別用bs了，那個會有束縛的，況且自己弄個可響應的頁面、組件又不難

bootstrap3官網是寫著優先移動端的，不過是在原先pc端的基礎上進行優化的，是同時兼顧pc端的。因此如果是純移動端，你可以對樣式進行定製(Customize and download · Bootstrap)，或者用其它框架。

如果你用rem布局，其實用不著bootstrap了，尤其是在對樣式進行定製化時比較麻煩，我推薦是學習其中常用的css代碼，抽離之後自己寫個簡易框架

Foundation如何？

這個框架很大一部分都為不太懂的前端的後台使用，方便他們快速搭建頁面，而真正移動端的開發，還有許多比bootstrap更高效率的框架。

要是真做優化，也不會選什麼框架了，自己寫，框架都是用來快速實現的，節省時間，個性化太多需要優化太多的前端當然還是自己寫的比較好，根據工程需求，做出一個適合的基礎架構，而且很多適合優化還是需要和其他任務，比如前端工程、後端介面、UI風格結合起來，做出一定的舍取，而不是一味的拿bootstrap就可以完成的