1. 基礎：HTML教程 CSS教程

2. 進階：Javascript教程 JQuery教程

3. 高階：AJAX教程 JSON教程 XML教程

4. 框架擴充套件學習：Bootstrap教程 jQuery UI教程 jQuery EasyUI教程 jQuery Mobile教程

5. 除錯工具：Firebug教程

6. 開發工具：HBuilder Sublime Text Dreamweaver Notepad++ Photoshop

對於初學者，最快的方式一般是做個實際專案。有人帶著做最好，如果沒有人帶，就多用搜索引擎。

同學加油

把基礎打紮實來，建議找教程書、影片教程邊學邊實踐，或去w3school、runoob這樣的學習網站、論壇系統學習。

我也做了一年的前端，本科學的機械，但是感覺網際網路程式設計是更好的未來，才轉行到這裡。開始學習的時候也是摸爬滾打，工作之後公司就自己一個前端開發，老大也真敢賭，在這裡我也大大小小做了六七個專案。pc端移動端都有，所以我跟你分享的東西會很真，不會站在一個很高的角度，但是也會讓你容易理解，通俗易懂，入門學習。

這位朋友問的初學者怎麼熟練用好html+css。確實今天的前端開發不像很早之前部署完頁面就可以了，後臺寫邏輯。現在都提倡前後端分離。而html，css算是最基礎最基礎的東西了，還不算是html5和css3的新特性。

很多頁面實現都可以使用html和某些css實現，不使用某些特別的標籤（說實話我也沒有完全掌握html標籤，但基礎佈局都可以實現）。估計現在很多人不會做下來安靜地看書的，但是會使用百度，看點菜鳥教程這些文件還是很好的。不用想太多上來就做一個京東首頁佈局，淘寶首頁佈局。這裡面其實有很多互動的，可能還涉及js的知識。建議可以找一個靜態頁面，實現簡單的佈局，在實踐中才能更好學習到東西。像悟空問答的回答區，任務這裡怎麼佈局，頭像為什麼是圓的？頭像右側怎麼才能兩行，左右側有個關注按鈕怎麼實現長寬色彩這些，一點一點實現，不要好高騖遠。

要有個好態度，主動去學習。如果小編想仿照某一個頁面，看到好看的效果，可以使用F12，看看人家的dom佈局，和樣式書寫。其中可以最直接在瀏覽器內修改看效果，保持一顆好奇心。多查資料，現在很多效果都可以百度出來，遇到問題不要先想-這咋整啊，不可能啊。這會讓別人很厭煩。最開始做app時候，也沒人帶我，我一想到圖片拍照上傳，二維碼掃描，地圖什麼的我也害怕了。所以在專案開始之前我就查閱資料，問一些前輩。其實很多技術都很成熟了，不用擔心，重要的是有一顆學習的心。

既然是熟練的使用，一定要多做，多寫。像很多人剛開始的時候連標籤都記不住，英文單詞都不行，也談不上熟練。打字的時候還單手指按，也不可能效率高，這些東應該是編寫好程式碼的前提。

現在技術更迭很快，有些人瞭解了html，css，js，其實可以先上手框架了。我也不是html，js這些玩得很溜了，才學習的框架。而是在些專案的時候一點一點的深入的。畢竟沒有到那個程度，看幾個例子就知道了原理，遇到某些效果就可以靈活的運用。我也是看了很多文件，有自己的思考，有自己的演示，像js同步非同步，宏任務微任務，剛開始接觸前端的時候根本沒有接觸過這些概念。

希望看到這裡的朋友，我感覺知識道理是實踐出來的，不是看到個東西想就能想明白，看著都很正確，到自己書寫的時候未必是那樣的。所以就是多練習，多寫，多問。只要肯付出，在電腦前減少玩遊戲的時間，減少看直播的時間，減少追劇的時間，減少扯淡的時間，能力慢慢就提升了。

html簡單些，只要清楚每個元素的特性就好了，css相對難一點，不過也還好，給html元素增加樣式，但是屬性偏多，要多寫，這樣才能記得住，等到你真正瞭解了每個屬性的特性，不管什麼佈局都是手到擒來，當然了，那些“特別特別”的樣式還是不太好寫，去Google搜尋一下。總結起來就一句話，要多練，那句話怎麼說來著，量變引起質變？好像是這麼講的吧。我記得程式設計好像有個什麼一萬行定律，跟這是一個意思。

基於我自學Java加入bat的經驗，我來推薦幾個能夠讓你進行高效練習的場景，從而儘快達到熟練水平。

初學過程中一定在書上或者影片裡見過各種demo，來描述各種標籤如何使用。然而不能滿足於看懂demo，而應該在明白demo實現的需求的基礎上，自己去嘗試重寫demo，即合上書，重寫做這道題。只有能夠用自己的理解，使用出新學的標籤後，你才算真的學會。

這是一個免費的，非盈利性質的網站，裡面有很多網際網路開發資源，你可以在裡面進一步學習HTML與CSS，並且在每一節都提供小quiz，可以透過這個小quiz來檢查自己是否真的學會了。

HTML與css學習的一個優點就是它的原始碼實在是太方便獲取了。你開啟任意一個網站，然後按F12，就會跳出這個網站的HTML與CSS程式碼。當看到喜歡或者不熟悉的網頁佈局之後，不妨透過這種方式來擴充自己的知識量。

當你對HTML與CSS已經熟悉了之後，不妨透過實戰來檢驗自己的實力。可以與一起學習同學溝通，設計出一個專案，說不定還能成為你創業的火種。

在熟練使用html+css前，先要熟悉並掌握html+css的結構和作用。

HTML的結構有三個部分。頭標籤是第一部分，它包含與網頁的目的和資訊相關的所有資料。第二部分是Body標籤，是網頁結構的主要中心，網站中的所有元素都會放在Body標籤裡。第三部分是腳部分，此部分通常包含網頁頁尾區域中可見的所有內容。

css是由W3C引入的，目的是為了減少HTML檔案的減少HTML檔案的大小，獲得更清晰的程式碼並將樣式與HTML分開同步。

如何才能熟練使用html+css？

1.一個階段的知識點學習完後，實操程式碼，學會使用除錯工具除錯程式碼。

2.選擇實戰專案，循序漸進提升程式碼水平。

3.多總結、多思考、多提問。

雖然說以上幾點看起來簡單，但是能夠真正落實的同學不多，學習前端就要沉住腳步、慢慢成長。

對於前端初學者來說，html+css是入門前端最基礎的內容，要學好並熟練運用html+css可從以下幾點出發：1.結合html+css+Photoshop，學會如何切割頁面。所謂切圖是指將設計稿切成便於製作成頁面的圖片，並完成html+css佈局的靜態頁面。2.開啟有關瀏覽器網頁，參照模板，編寫自己的頁面。透過瀏覽器自帶的除錯工具（F12進入除錯）開始除錯。學會除錯會提高前端初學者的程式碼水平。3.養成實操程式碼的習慣，對於前端初學者來說，光看書、看影片的學習是要不得的，是無法上手的。4萬行程式碼是一個量變到質變的標準線。只要將這幾點做好，就能夠更加熟練地運用html+css。

如果有更多想要了解或者不懂的可以找好的培訓機構進行學習。我朋友就是在原始碼時代學習，現在已經就業。