css模陣三種類型表如下所述：
1、流動模型(Flow)
2、浮動模型(Float)
3、層模型(Layer)
一、流動模型
流動(Flow)是默認的網頁布局模型，網頁在默認狀態下的HTML網頁元素都是根據流動模型來分布網頁內容。
2、在流動模型下，內聯元素都會在所處的包含元素內從左到右水平分布顯示。
二、浮動模型(float)
塊狀元素都是獨占一行，如果想讓兩個塊狀元素并排顯示，則可以設置元素浮動實現。
三、層模型（Layer）
層布局模型就像是PhotoShop中的圖層編輯功能，每個圖層能夠精確定位操作。
id是css的唯一選擇器，使用ID選擇器，必須給標簽添加上id屬性，為標簽設置id="ID名稱"。
結合自身的經歷談下這個問題，不一定適合于所有人。
感覺可以分為下列幾個學習階段。
HTML+CSS這兩個應該是對初學者比較友好的了，html大概了解一些常用的標簽，css的話看下各種選擇器的寫法，然后找個網站模仿著寫一遍樣式，基本上就有感覺了。之所以推薦這兩個先學除了簡單，還有成就感，寫的東西直接以頁面展示出來，這比很多大學以C教學，對著命令行打印一堆數據的體驗要好很多。你甚至可以嘗試著寫一個靜態網站來做一個自己的簡歷，展示到朋友圈。
學習資源的話，推薦兩本書吧。
《Head First HTML and CSS》
Head First系列的書一直評價很高，這本書也是。但我覺得其實沒必要一來就學那么多，很多標簽和屬性你都記不住，更不用說css那么多屬性了，很多從業多年的前端應該也只能記住其中的大部分吧。推薦的學習方法是Learn by doing.過程中遇到問題的話，學會用搜索引擎+MDN.
《CSS Secrets》
看完這本書你會感嘆，原來CSS還可以這樣寫。
JavaScriptjs的話還是比較復雜的，很難短時間就掌握的很好，但你至少要搞懂一些基本的控制流語法，變量，常量，函數，類這些東西。至少做到你參考別人的代碼能看懂別人大概在寫啥。
小白可以看下這本GitBook上的書，基礎的東西都有涉及，也不長。最多一個小時就能看完。https://www.gitbook.com/book/xinqiu/learn-javascript-cn/details
稍微有基礎了，想深入學JavaScript這門語言的話，可以看下《Javascript權威指南》這本書。
但老實說，這本書雖然很好，但是不適合初學者看，我看了一部分之后覺得純看書籍的話還是太無聊了，不太適合自己，遂棄之。
相比之下，我更推薦廖雪峰大神的《JavaScript教程》https://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000，在網上就能看，前面很基礎，然后后面開始飆車。大家可以選擇性看，文中提到了很多初學者會遇到的坑，比如var that = this.這種小技巧。很多時候初學者會被這種問題困擾很久，有人指路會幫你節省很多時間。
之后你可以了解一些ES6的新語言特性，然后試著用React，Vue，Angular之類的框架來試試。
選擇的話，感覺新手推薦Vue，封裝的很好，有時會覺得就算不會js，跟著Vue的教程，也能開始寫一些東西。React的話，個人感覺要稍微難點，寫的感覺和原生的JavaScript要接近些。Angular沒寫過就不評價了。但這三個框架的很多思想其實有共同之處，學會一個，學另一個會簡單很多。所以不必太過糾結。而且前端這個領域，技術更新很快，如果你想學一門一勞永逸的技術，那么前端很可能并不適合你。
PHP+Mysql這兩個感覺是相互依賴的，寫PHP不可避免的就要操作數據庫。PHP我寫的也比較少，只用Phalapi寫過一個小網站，但感覺整體寫起來的感覺不是那么爽，但也有可能是我打開的方式不對，數據庫的話，php有別人封裝好的ORM庫可以對數據庫進行操作，這使得你可以不會sql語法也能對數據庫進行操作，實在需要用到sql的時候，可以查下文檔，然后模仿著寫。因為這方便了解的不多，就不瞎提建議了。
不過雖然php是世界上最好的語言，我也建議你有機會試試python或者node.js。或許會打開新世界的大門。
以上這些內容如果自學的話沒個至少需要一兩年的時間，還無法保證能學會。培訓大概需要5個月的時間。想全部掌握好以上只是，可以來千鋒武漢IT培訓機構系統全面學習一下。千鋒全程面授模式教學，真實項目實戰，可先來免費試聽兩周，實地親身體驗下！
對于一些沒有編程經驗的人來說，一開始就學習 web 前端可能會讓你覺得比較困難。
因為你的能力還處在初始階段，你根本不知道你缺少哪方面的知識。
所以，在正式學習之初，你非常有必要先了解一下前端的能力模型。
前端工程師，都需要掌握哪些能力呢？
簡單粗暴點，只需要掌握這張圖里的能力就行了。
開個玩笑，新手的話，還是要循序漸進。
LV1：學會制作靜態頁面（Web + Mobile）
HTML、HTML5：
理解如何瀏覽和創建網頁、基本的語法規范、常用標簽及屬性、網頁之間的鏈接與跳轉、標簽節點層級節點。
CSS:
基本語法和三種書寫位置、選擇器和格式化排版、盒模型的高級用法、常用布局模型
LV2：學會制作動態頁面
JavaScript ：
基礎語法和變量、數據類型和數據類型轉換、條件判斷、循環語句、函數、數組等內置對象
（有了這三個，你基本可以寫一些簡單的頁面了，但是仍然需要學一些經典的庫和框架。）
經典庫：比如 jQuery,YUI2,YUI3
經典框架：比如 Bootstrap
LV3：前后端分離，打造 Web App
Vue.js/AngularJS2/React
Node.js，使用 Express/Koa 配合 MongoDB/Redis 涉足到后端領域
自動化測試
其他：
熟悉 Git 與 Shell 的使用
學習路徑
1.入門 HTML + CSS
這里推薦一本書，Head First HTML與CSS（第2版）。從原理到方法都介紹得很詳細，通俗易懂，活潑有趣。html和css入門力薦。學完大概 1-2 個周。
2.JavaScript + jQuery
JS：看 w3school 教程，花 2-3 天，但 w3school 教程有點過時，看完只能了解個基礎，深入學習的話，推薦看《JavaScript 權威指南》，《JavaScript 高級程序設計》。兩部都是大部頭。看完還需要在去網上找 ES6 資料學習，推薦 ECMAScript 6入門，深入淺出ES6。
jQuery 的話，去官方文檔看即可。
熟練掌握大概需要1個月。
3.Vue.js/Angular 2/React
Vue.js：查看官方中文文檔大約需要 3 天左右。Vue 上手容易，但沒有其他前端框架使用基礎的人只看官方文檔難以理解 Vue 高級用法以及在生產環境中的運用。目前 Vue 社區還比較小，除官方文檔外難以找到優秀資料。
4.webpack & 測試
webpack 是目前應用最廣泛的前端模塊管理工具，功能強大。
測試相關的框架多且雜，大多是社區產物，較難系統學習。
以上的這些資源足夠你學習幾個月的，但它們不會帶你走得更遠。
但是，如果你已經學了這么多，你已經有足夠的能力去繼續前端的學習，直到你可以完美勝任一個前端工程師的要求。
最后留一點小的建議
你會經常地遇到 bug 和其它一些問題。這可能會讓人沮喪，但你要盡量保持冷靜，并系統地去思考。記住實踐是解決問題的最佳方法。
我們采集的是石頭，但是必須時刻展望未來的大教堂。
持續做一些小改進，慢慢地你就會驚奇地發現你的經驗得到了怎么樣的發展，你的技能得到了怎樣的提升。