Flexbox 是一個(gè)強(qiáng)大的新生CSS布局模塊，完全脫離于傳統(tǒng)的web開(kāi)發(fā)實(shí)踐。網(wǎng)上有很多相關(guān)的文章，大都關(guān)注于規(guī)范的細(xì)節(jié)，導(dǎo)致文章冗長(zhǎng)，難懂，甚至有些晦澀。相反，對(duì)于設(shè)計(jì)師和開(kāi)發(fā)者如何使用 flexbox 解決布局問(wèn)題的討論相當(dāng)少，至此，這篇文章出現(xiàn)了。

　　從基礎(chǔ)層面上來(lái)講，flexbox有三個(gè)特性是設(shè)計(jì)之根本。但也是在很長(zhǎng)一段時(shí)間內(nèi)單純使用CSS很難或者不可能完成任務(wù)：對(duì)齊方式，排布和順序。

　　Flexbox在最終形成今天的規(guī)范之前，歷經(jīng)了三次迭代。每一次迭代都伴隨著不同的屬性名，在不同瀏覽器下有著相應(yīng)的特定前綴。而現(xiàn)在，我們所處在這樣的時(shí)刻，所有的瀏覽器都支持無(wú)前綴的終極規(guī)范，但是想要兼容低版本的瀏覽器還有很多坑要填。正因如此，我強(qiáng)烈建議你按照 flexbox 的最終規(guī)范編寫(xiě)代碼，并且使用最新的瀏覽器進(jìn)行測(cè)試，然后再去實(shí)現(xiàn)向前兼容。想要讓你編寫(xiě)的代碼同時(shí)兼容所有的瀏覽器是一件很頭疼的事。

　　盡管flexbox可以和其它的CSS布局系統(tǒng)一同工作，但是在開(kāi)始使用新的系統(tǒng)之前，丟掉以前在web布局中的假設(shè)和實(shí)踐很重要。這是一種全新的工作方式，如果堅(jiān)持以前的思維，你將受到阻礙。

　　你可能偶爾聽(tīng)到“flexbox 是用來(lái)干啥干啥的”。誠(chéng)然，其它的布局系統(tǒng)會(huì)很快的補(bǔ)充上 flexbox——比如 grids 和 regions，但這種稱述并不完全準(zhǔn)確。CSS不是語(yǔ)義化的，沒(méi)有哪一個(gè) CSS 特性就是固定做某件事情的。你可以使用任意的 CSS 來(lái)完成你的需求，唯一的問(wèn)題是什么樣的代碼才能更高效的實(shí)現(xiàn)目標(biāo)。正如我們看到的，flexbox 解決了設(shè)計(jì)者在布局上正面臨的諸多問(wèn)題。

　　Flexbox以前的幾個(gè)版本給現(xiàn)在的開(kāi)發(fā)者們帶來(lái)了一些風(fēng)險(xiǎn)：很可能讀到一篇沒(méi)有指明書(shū)寫(xiě)時(shí)間的文章，最后發(fā)現(xiàn)自己正在看2009年的flexbox 規(guī)范說(shuō)明（現(xiàn)在已經(jīng)廢除）所以，時(shí)刻謹(jǐn)慎小心，提高警惕。