ma2017560
無非就是倆種自學和培訓學習。前端學習的東西還是比較多的，html和css的話記住就會用，javascript這的話就比較注重邏輯了，算前端裡面的重點，這自學的話就比較有難度了，最後會學一堆工作中用到的框架，比如 vue等等。
建議初學者去報個班系統的學習一下知識點，有時間的話去看看尚學堂百戰程序員的官網。他是一下線上和線下都有的培訓機構，網評還不錯，師資力量都不錯。
百戰嘟嘟前端
本人也是一枚前端迷，學習前端經歷了很多事。
是我朋友推薦我去學前端，當時前端很火，也有市場，當時什麼都不懂，甚至連電腦的基本操作都不會。當時在成都去了兩家培訓機構，他們還是用記事本的方式給你演示了幾個標籤p,a,span
就喊你照著打出來突然誇你天賦異稟，什麼稍加培訓日後便可以輕鬆走向人生巔峰之類的話，培訓費4個月9800，當時肯定是沒信。
後來在朋友的幫助下自學，買書，找免費的視頻，當時看的是潭州的公開課。總的來說，前端的入門要求極低，前期興趣度也很高，因為幾個簡單的標籤就能展示靜態頁面。
後期也容易放棄，都說原生js是前端的命脈，當然很重要了，要學和要用的代碼就很多了，一個小小的標點符號都能導致代碼不運行。
要想學好前端
1 必須要有對前端的興趣，都說興趣是最好的老師
2 學習期間不能鬆懈，三天打魚兩天曬網是不好的
3 多練多找項目來做，提升代碼熟練度
4 如果有大牛是朋友那就不說了，都懂得
林妹妹視頻
首先明確你是否喜歡前端，以及前端學習的方向
有句話怎麼說的，興趣是成功之母，如果你選擇這一行業，一定要是發自內心的喜歡這個行業，尤其你是自學，如果你是為了工作而工作，去自學的話，很容易堅持不下去。還有一個需要強調的是，前端這個行業發展很快，需要不斷的學習，有可能你還沒學完，新的內容又更新了，前端是一個不斷學習自我提升的過程。如果你對這個行業沒興趣的話，建議你還是不要學習前端。
前端的內容和框架很多，現在很流行大前端，前端可以做網站開發、手機端開發、桌面軟件開發、遊戲開發、視覺特效，3D開發、VR、後臺開發nodejs、物聯網等。方向很多，進入這個行業前，你一定要選擇一個感興趣的方向深入下去，如果都想精通，也不太現實。
建議瞭解、掌握一門後端語言
由於前端javaScript語言的特點，和高級語言比如JAVA、C# 有不少的差距，如果你沒有編程基礎的話，建議先從這些高級語言學習基礎語法和編程邏輯，這裡並不是讓你很深入的去學習這些語言，掌握基礎的語法和應用就夠了，主要是為了讓你理解編程語言的特點和思維邏輯。還有就是前端往往需要和後端開發人員進行配合，有了這樣的基礎後，日後配合起來溝通更方便。有了這些基礎後，你再學前端，你會發現前端很簡單，掌握其語法和前端邏輯也是幾周的事情。
如果你是非計算機專業，建議學習一些基礎的算法和數據結構
算法和數據結構是每個計算機專業出身的必修課，是開發人員的基礎和核心競爭力，如果你是非科班出身，建議還是學習掌握一些基礎的數據結構和算法後再去學前端，因為現在前端產品也越來越複雜，這就意味著對前端性能要求越來越高，如果你能從算法和數據結構的角度去優化前端性能，這意味著你能在這個行業能走的更加長遠。
接下來我們從基礎的 HTML、CSS、JavaScript語言學習，一定要看書，再看視頻
前端最基礎的內容莫過於 HTML、CSS、JavaScript 這些內容了，切記在還沒有深入掌握這些內容後，就去學習前端的一些框架，比如vue、react、angular,建議先把基礎內容夯實後，再去學習這些框架也不遲。學習這些基礎內容，不要一上來就看視頻，因為視頻的內容不夠系統化，知識比較散落，沒有文字的梳理和歸納。建議還是靜下心來，從書本看起，建議你選擇前端的經典入門書籍紅皮書或封面是犀牛的前端書籍，為了避免推銷之嫌，感興趣的可以私信我索要書名。基於書本內容再結合視頻內容學習，這樣學習效果才會更好。
一定要動手實踐，切記光看不練習
學習知識最好的方式，就是動手實踐，哪怕你現在手裡沒有什麼項目或者不知道練習什麼的話，你可以把書上的例子和代碼一點點的敲出來，這樣潛移默化會加深你對知識的理解。學到一定的程序，你一定要動手親自實踐下如何佈局一個網站，這個過程一定不能省，我發現不少前端開發人員不喜歡弄佈局，但是佈局是前端的基礎，一定要把CSS佈局的思想吃透了。
掌握以上基礎後，建議學習下JQuery、bootStrap這些類庫
雖然 JQuery 沒有像以前這麼火了，但是作為一名的合格前端，這個工具我們是必須要掌握的，只有掌握了這個，你才能更深入的理解前端的工作，因為這個庫容易上手，通過這個庫的學習，你能快速進去前端開發崗位的狀態，去做一些更有針對性的實踐，比如親自練手一個新聞站點、博客站點的前端製作。
bootStrap 也建議前端初學者掌握，Bootstrap是Twitter推出的一個用於前端開發的開源工具包。它由Twitter的設計師Mark Otto和Jacob Thornton合作開發,是一個CSS/HTML框架。使用這個框架後，能很方便的讓我佈局出現代感十足的響應式網站。
最後選擇一個前端框架，比如vue、React或 Angular
大多數公司的前端產品，不可能是一個人去完成，而是一個團隊，團隊開發就需要有一個工具進行支撐，來保證項目的代碼的質量和進度。因此掌握一個或兩個前端框架是我們必備的技能。vue、React這兩個框架入門比較簡單，中文資料也比較多，你可以根據自己情況選擇一個就行。
小節
關於如何學前端就和大家聊到這裡，總而言之，自學前端一定要有興趣，從基礎的 HTML、CSS、JavaScript 學起，邊學邊動手實踐，最後才是vue、React或 Angular框架的學習，還有一點需要強調的是，自學自律性一定要強，要有個清晰的學習計劃和目標。
前端達人
剛開始學習HTML+CSS的時候，我並沒有費多長的時間，感覺很輕鬆，而且做了不少的精美靜態網頁。但是當我學習PHP的時候，跟著書學習就完全看不懂了，根本沒法理解書上說的專業術語，這讓我一度想到自己不適合學習這個，但是過後情緒穩定了也就好了，我總是遇到難題的時候就想自己太笨了，這個我心態有點不好。所以在這裡不建議想學習web前端開發的新手一頁一頁的看書學習，沒有什麼效率，而且很難看懂或者看下去，書都是非常的厚重。
下面我給你學習前端的新手幾個建議：
第一：切記學習前端開發不可以依賴任何人，我做了開發這麼久，5年了，見過很多依賴老師的學生，這樣的後果就是自己沒有解決問題的能力，也沒有自主學習的能力，面試不能通過，找工作會非常難，因為學習開發就是鍛鍊這種自我學習的能力。
第二：必須而且一定要有一個老師帶著學，無論是學習PHP還是前端，根據我見過的人的經驗，如果沒有一個明白人幫你解決一下問題，首先會浪費非常多的時間。而且學習的不專業，對於基礎的把握不牢靠，後面的都是白扯。
第三：堅持很重要，確實有很多學習前端的人在學習PHP的時候學著學著就放棄了，這叫知難而退，PHP確實難，但是就是因為難才有價值，我們評判一個前端開發者是什麼水平，就是用PHP來說話。
HTML5相關盒模型學習資料：
學習目標
· 1、認識盒子模型
· 2、盒子模型的組成部分
· 3、學習盒子模型的相關元素 margin padding
一、css盒模型的概念及組成
概念：盒模型是css佈局的基石，它規定了網頁元素如何顯示以及元素間相互關係。css定義所有的元素都可以擁有像盒子一樣的外形和平面空間.
盒模型的組成：邊框、邊界/邊距、補白/填充、內容區。
二、盒子模型的相關元素
1、padding的使用方法
說明：
填充：padding,在設定頁面中一個元素內容到元素的邊緣(邊框) 之間的距離。 也稱補白或填充。
用法：
1）用來調整子元素在父元素中的位置。
注：padding屬性需要添加在父元素上。
2）padding值是額外加在元素原有大小之上的，如想保證元素大小不變，需從元素寬或高上減掉後添加的padding屬性值
屬性值的4種方式：
四個值：上 右 下 左 {padding:0px 0px 0px 40px;}
三個值：上 左右 下 {padding:10px 20px 30px ;}
二個值：上下 左右 {padding:10px 20px ;}
一個值：四個方向 padding:2px;/*定義元素四周填充為2px*/
說明：可單獨設置一方向填充，如：上方向padding-top:10px; 右方向padding-right:10px; 下方向padding-bottom:10px; 左方向padding-left:10px;
2、margin的使用方法
說明：
邊界：margin,在元素外邊的空白區域，被稱為邊距/邊界。 “屬性值的用法同上”
margin-left:左邊界
margin-right:右邊界
margin-top:上邊界
margin-bottom:下邊界
屬性值的4種方式：
四個值：上 右 下 左
三個值：上 左右 下
二個值：上下 左右
一個值：四個方向 margin:2px;/*定義元素四邊邊界為2px*/
margin:0 auto;/*一個有寬度的元素在瀏覽器中橫向居中。
定義元素上、下邊界為2px，
說明：可單獨設置一方向邊界，如：margin-top:10px;
注：/*上下邊距重疊，左右邊距相加*/
三、標準盒子大小計算方式
寬 =左右border+左右padding+width，
高 =上下border+上下padding+height，
例如：一個盒子的border 為 1px，padding 為 10px，content 的寬為 200px、高為 50px，
寬= border*2 + padding*2 + content.width = 1*2 + 10*2 +200 = 262px，
高= border*2 + padding*2 + content.height = 1*2 +10*2 + 50 = 112px，
怪異盒模型/IE盒子模型組成：margin+內容區
寬：width;
高:height;
四、盒模型注意事項
*margin值的解析：左右邊界累加，正常文檔流的上下邊界重合。
*在正常文檔流下，子元素（塊）直接寫margin-top時，會將margin-top屬性值加上父元素身上,(子元素或父元素不設置任何浮動及定位的屬性，或父元素不設置邊框的情況下。)
一個標記可以設置多個class名
語法：標記>
千鋒長沙
住在一個20平方米的出租屋裡，吃著最便宜的外賣，做著週而復始、毫無新意的工作，這是我每天的生活狀態。但是我不甘心就這樣碌碌無為一生，我要改變自己的命運。
於是通過同學的介紹，我來到了千鋒重慶web前端培訓。在這裡學習，慢慢地改變了我的人生軌跡。
剛開始接觸重慶web前端培訓的時候，覺得很新鮮，認為自己學起來應該沒什麼問題。但是深入學習之後，才知道重慶web前端培訓的難點有很多。不過好在老師和同學都很熱心，幫助我解決一個又一個困難，自己也開始慢慢掌握一些學習方法。第一階段的學習主要就是背，然後多敲代碼，熟悉知識。應用多了，單詞、代碼也都能記住了。接下來的幾個月主要練習動手操作能力，雖然遇到的困難很多，但是有千鋒重慶web前端培訓老師的幫助，這些問題都迎刃而解了。
通過這幾個月的學習，我認識了網頁構架、瀏覽器適應以及移動端構建，同時也深刻體會到學習如逆水行舟，不進則退。如果想跟上時代的發展，就需要不斷地學習，提高自身的專業能力。如果只是滿足當前的生活狀態、生活方式，早晚會被社會所淘汰。當然，對於一個對前端概念模糊的人來說，想要學習和掌握一門新的知識，難度還是挺大的，因為不僅在學習中會遇到困難，還會在操作過程中出現各種各樣的漏洞，但是我們要學會勇敢、堅強、永不放棄。
付出後就會有收穫，我成功通過了面試，成為在重慶web前端培訓發展很有潛力的公司的一員。當我走出面試場，看到外面那一縷陽光時，覺得來千鋒重慶web前端培訓很值得!
千鋒教育重慶
分享一下親身經歷
大專畢業，在大二第二學期開始的時候覺得自己迷迷糊糊的過了半個大學，特別的可惜，之前兩年都沒學習過，大專生舉手🙋♂️，然後想著說以後出來怎麼辦，中間省略一萬個字
選擇了前端這條路，剛開始看的是。Head First HTML與CSS（第2版） 然後可以堆出一個簡單的網站，挑自己喜歡的內容去做，多寫幾次 不斷優化，看著w3c之類的，不斷豐富自己的網站，你會發現一堆堆代碼搞出來特別有意思的各種效果，this web，哈哈哈哈
再往後，開始去淘寶上買一些課程比如說一下機構的課程，淘寶或者閒魚上面都特別便宜，幾元就能買到好多G，接著刷，至少要搞到bootstrap，jquery，ajax某問題，這些可以讓你做出很多好看的效果，對於剛開始自己的學習其實是很有幫助的，哈哈哈哈，然後這個時候可以回顧一下紅寶書，看紅寶書，這一階段特別重要，自我感覺哈，一定要多敲代碼，多敲多敲
後面感謝一個師兄和我對接了一個前後臺交互的項目，有了一個項目經驗吧也算是，當時我們的專業特別少人走專業路，畢業之後都去銷售什麼的了，所以說求資源真的很少，也明白資源真的很重要，找到人一起xue xi
歷時到大三上學期結束的時候找了一份2800的實習工作，中間省略了一堆找工作過程，開始有了很多實戰，layui，ajax，緩存問題，上線部署問題，小程序開發等等
除了工作之後自己還學習一下vue，react的生態
在大三畢業之後，選擇了辭職換到了一家稍微大一點的公司，技術展還是比較豐富，多方面都可以接觸到
普通人dp
學習編程方式不一，可以自學，可以報培訓班，也可以找個前輩帶著學理論學經驗。但是，自學很考驗自制力，容易被各種事情耽擱。另外，培訓機構學費太貴了，學得怎麼樣還是個未知數，出來找工作面試很容易被看出培訓機構出來的，從而被拒。最好的建議是找個小公司，邊實習邊學習，既積累了理論知識又積累了工作經驗，操作能力也上去了，面試也有項目經驗可說，很好找工作。我之前就是在一個小的創業公司學習，老闆親自帶著做項目，不是專業培訓機構，帶幾個學生主要是解決創業期間生活問題，交的學費也只有幾千塊，比專業培訓機構少了幾倍，學了三個多月出來找了個不錯的工作，對我目前的狀態很滿意。有意向我可以推薦。
編程小新
想要學好web有人帶是最好的，如果自己有時間（充裕）自學也行，剛開始的時候就看視頻背標籤單詞、準時記筆記有時間多翻翻、一定記得多回憶（效果不錯）。最主要的理解那些標籤的含義，這些都是我學到現在的心得。最後也是最重要的是堅持。
戴琳997
web前端課程一般學校中只會開一門網頁設計，至多也就是入個門而已，更重要是為學習後端鋪墊基礎，那麼對於那些對前端感興趣的同學來說應當怎樣去學習前端內容呢？本人也是一名前端工作人員，下面就說說自己的愚見吧。
大家都有很多偏見認為前端很簡單，實則不然，前端只能說是入門簡單要是想深入可並不簡單，首先要掌握牢固的基礎知識，我簡單的說一下我所認為的路線圖吧
第一步，應當去學習html，去了解基本的頁面元素標籤
第二步，去學習css，會基本的樣式控制
第三步，去學習js基礎，掌握基本的DOM操作
第四步，學習jq，並熟練運用這時你會發現一些操作以及動效會很好做
第五步，去學習css3自己html5並能夠深入瞭解並掌握js
第六步，學習當前比較火的js框架，如vue,react,angular可以都瞭解一下，選擇自己喜歡的深入學習
第七步，學習小程序開發
第八步，學習現階段比較火的移動端混合開發技術，uniapp ReactNative flutter等都可以，flutter如果沒有java開發基礎相對來說比較難入門
第九步，學習nodejs，這個時候你就打通了你的任督二脈進階成為web全棧工程師
最後，如果有能力的話可以去學習一下算法，架構什麼的
喜歡的話，歡迎關注，後期會推出優質的前端知識及教程
湫音社
想要入門前端，可以看書，看視頻，或者是跟著老師去學習，但是哪兒種方法都是需要你真的用心去學的。如果不用心，那麼一切都是白費！
前端入門可以看什麼書？
《響應式Web開發項目教程（HTML5+CSS3+Bootstrap）》
互聯網的世界離不開前端開發，大前端時代最大的特點在於一次開發，同時適用多個平臺，可以說是Web統一的時代。
本書將當前熱門響應式Web開發與HTML5和CSS3完美的結合起來，以項目為導向，深刻且通俗地揭示了Web前端開發的內幕。
全書共8個單元，詳細講解了HTML5、CSS3、JavaScript基礎、響應式Web設計、Bootstrap等技術的應用。
第1單元從宏觀角度介紹了響應式Web開發的基本概念以及HTML5和CSS3的新特性，讓讀者對它們一個初步的理解和認識；
第2~4單元講解了HTML5和CSS3中的一些常用標籤和屬性，它們是響應式Web開發必備的基礎知識；
第5單元講解了HTML5畫布，作為HTML5的標誌性突破，它是本書的一大亮點；
第6單元講解了HTML5的音頻和視頻功能；
第7單元深入講解了響應式Web設計的相關技術點，它是高級的前端開發人員的必要修養；
第8單元講解了Bootstrap的下載、安裝以及相應組件的基本應用，它是一個非常高大上的響應式設計神器，愛技術的你，絕對值得擁有。
前端入門可以看什麼視頻？
傳智播客、黑馬程序員有很多前端的視頻都可以看，有大牛老師講的，你可以去看，並且還有學習路線圖可參考哦！
