仔細(xì)想來(lái)玖喘，接觸Web前端開(kāi)發(fā)已經(jīng)一年多了洒闸，從最初的DIV+CSS學(xué)起，到JavaScript可柿、jQuery怯邪、Bootstrap框架等等绊寻，前端要學(xué)習(xí)的東西很多。接下來(lái)就總結(jié)一下我在學(xué)習(xí)過(guò)程中的一些經(jīng)驗(yàn)吧悬秉，希望能夠?qū)W(xué)習(xí)Web前端的小伙伴帶來(lái)一些小小的幫助澄步。
第一、學(xué)好基礎(chǔ)知識(shí)和泌，做一個(gè)基礎(chǔ)扎實(shí)的開(kāi)發(fā)者驮俗。
在IT行業(yè)，每年都會(huì)有很多新的技術(shù)誕生并且得到廣泛的推廣允跑，前端技術(shù)也不例外。所以無(wú)論學(xué)到多深的程度搪柑，扎實(shí)的基本功肯定是必不可少的聋丝。
（1）HTML：盡量掌握盡可能多的標(biāo)簽
?必須掌握的標(biāo)簽有：<html>、<head>工碾、<title>弱睦、<body>、<h1>渊额、<p>况木、<a>、<img>旬迹、<table>火惊、<tr>、<td>奔垦、<th>屹耐、<form>、<input>椿猎、<select>惶岭、<option>、<textarea>犯眠、<div>按灶、<span>、<script>筐咧、<link>鸯旁、<meta>、<style>、<hr>羡亩、<br>等等摩疑。當(dāng)然還有很多比較少用的標(biāo)簽，例如<lable><address><var>等畏铆，這些雖然平時(shí)比較少用甚至幾乎不用雷袋，但是當(dāng)你學(xué)到Boostrap框架時(shí)，你會(huì)發(fā)現(xiàn)Boostrap框架為這些標(biāo)簽賦予了特定的功能與外觀辞居。除此之外楷怒，新增了很多標(biāo)簽和屬性，使得HTML語(yǔ)言更加強(qiáng)大瓦灶。例如HTML5中的<button>具有數(shù)據(jù)提交的功能鸠删；<canvas>可以實(shí)現(xiàn)頁(yè)面矢量圖的繪制；<audio>可以開(kāi)發(fā)有關(guān)音頻的項(xiàng)目贼陶。還有很多新的內(nèi)容刃泡，需要初學(xué)者更多的接觸并掌握。
（2）CSS：對(duì)各個(gè)屬性以及一些屬性之間結(jié)合使用的技巧應(yīng)該多鉆研碉怔。
?CSS能夠統(tǒng)一有效地對(duì)頁(yè)面的布局烘贴、字體等網(wǎng)頁(yè)中的各個(gè)元素顯示屬性進(jìn)行控制，可以方便快捷地實(shí)現(xiàn)精美的頁(yè)面表現(xiàn)效果撮胧。
你會(huì)用CSS技術(shù)的使用技巧解決下列問(wèn)題嗎桨踪？
清除浮動(dòng)有哪些方式？比較好的方式是哪一種芹啥？
當(dāng)容器中具有浮動(dòng)元素時(shí)锻离，如何為容器設(shè)置邊框或背景顏色？
怎樣讓塊級(jí)元素在容器中水平居中墓怀？
當(dāng)多個(gè)連續(xù)塊級(jí)元素的浮動(dòng)布局影響了原本不想浮動(dòng)的對(duì)象時(shí)該如何處理汽纠？
容器內(nèi)部的對(duì)象如何實(shí)現(xiàn)相對(duì)于容器的自由定位？
為什么要初始化CSS樣式捺疼？
（3）CSS+div布局模式：許多布局模式的基礎(chǔ)疏虫，也是大部分前端開(kāi)發(fā)人員接觸到的第一種布局方式。
這種布局模式對(duì)于PC端頁(yè)面的設(shè)計(jì)是非常有幫助的啤呼，同時(shí)對(duì)于后面將會(huì)遇到的“移動(dòng)端布局”卧秘、“響應(yīng)式布局”等，這種布局方式都具有一定的指導(dǎo)意義官扣。
第二翅敌、將JavaScript作為前端學(xué)習(xí)的重點(diǎn)。
JavaScript是目前大多數(shù)主流瀏覽器支持的面向?qū)ο蟮哪_本語(yǔ)言惕蹄，它可以在不與服務(wù)器交互的前提下對(duì)HTML的頁(yè)面內(nèi)容進(jìn)行修改蚯涮。JavaScript控制著網(wǎng)頁(yè)的行為治专，決定著網(wǎng)頁(yè)“做什么”。
系統(tǒng)學(xué)習(xí)過(guò)JavaScript的同學(xué)們遭顶，你看看下列問(wèn)題你能準(zhǔn)確的找到答案嗎张峰？
通過(guò)表達(dá)式來(lái)系統(tǒng)闡述“==”和“===”這兩個(gè)運(yùn)算符的區(qū)別。
把某個(gè)元素移除你的視線(xiàn)的方法有哪些棒旗？
你對(duì)JSON了解嗎喘批？
通過(guò)哪個(gè)函數(shù)可以判斷從文本框中獲取的內(nèi)容是不是數(shù)字？
DOM 操作——怎樣添加铣揉、移除饶深、移動(dòng)、復(fù)制逛拱、創(chuàng)建和查找節(jié)點(diǎn)敌厘？
怎樣判斷是否為整數(shù)？
delete運(yùn)算符都能刪除哪些內(nèi)容朽合？
在腳本中俱两，this有幾種使用情況呢？
第三曹步、多練習(xí)多操作锋华，實(shí)踐是檢驗(yàn)真理的唯一標(biāo)準(zhǔn)。
IT編程是需要多加實(shí)踐的箭窜，要不斷反復(fù)進(jìn)行上機(jī)操作，是學(xué)習(xí)編程開(kāi)發(fā)的唯一方法衍腥。
第四磺樱、多利用網(wǎng)絡(luò)資源
在這里為大家推薦幾個(gè)可以免費(fèi)學(xué)習(xí)前端的網(wǎng)站，希望大家可以多多瀏覽婆咸，利用好互聯(lián)網(wǎng)資源竹捉。
菜鳥(niǎo)教程：一個(gè)學(xué)習(xí)基礎(chǔ)知識(shí)的網(wǎng)站，以文檔形式展示尚骄。
W3CSchool:這里列舉了多門(mén)前端技術(shù)和后臺(tái)技術(shù)的基礎(chǔ)知識(shí)块差。內(nèi)容較為基礎(chǔ)，以文檔形式展示倔丈。
慕課網(wǎng)：以視頻形式講授很多前端知識(shí)憨闰。
極客學(xué)院：與慕課網(wǎng)相似。
Bootstrap中文網(wǎng)：這里涵蓋了Bootstrap框架全部的組件和插件需五。
第五鹉动、多閱讀關(guān)于前端的經(jīng)典著作
在這里給大家介紹幾本前端開(kāi)發(fā)的經(jīng)典著作
第六、多歸納總結(jié)宏邮，透過(guò)現(xiàn)象看本質(zhì)
前端需要學(xué)習(xí)的東西很多泽示，知識(shí)點(diǎn)比較雜缸血，如何記憶呢？這就需要大家多多歸納總結(jié)械筛，例如可以把一些常用的代碼寫(xiě)法記錄下來(lái)捎泻。這里我提幾個(gè)問(wèn)題，大家看看是否需要總結(jié)自己所需的知識(shí)點(diǎn)吧埋哟。
在JavaScript中笆豁，如何為多個(gè)元素綁定相同的事件？這樣的操作有幾種方法定欧？
總結(jié)HTML5新增的標(biāo)簽還有屬性有哪些渔呵？
對(duì)于DOM節(jié)點(diǎn)的操作，jQuery和JavaScript各采用了哪些不同的方式砍鸠。
jQuery所提供的所有選擇器是不是需要總結(jié)一下扩氢。
想一想，閉包都用在哪些場(chǎng)合中爷辱？
第七录豺、重視移動(dòng)布局，多使用移動(dòng)端框架開(kāi)發(fā)饭弓。
大家都知道現(xiàn)在移動(dòng)開(kāi)發(fā)双饥，微信開(kāi)發(fā)很熱門(mén)，掌握其中的技術(shù)會(huì)很吃香的弟断。在這里給大家介紹本人用過(guò)的兩個(gè)移動(dòng)端框架咏花，希望前端的朋友可以多多學(xué)習(xí)。
bootstrap：這個(gè)就不用說(shuō)了阀趴，這是響應(yīng)式開(kāi)發(fā)的重要框架昏翰，一定要掌握。
Framework 7：這個(gè)是比較常用的一款移動(dòng)端框架刘急。
當(dāng)然棚菊，多了解一些有關(guān)微信公眾號(hào)開(kāi)發(fā)和微信小程序方面的知識(shí)就更好了。
第八叔汁、當(dāng)對(duì)前端了解較深的時(shí)候统求，盡自己努力學(xué)習(xí)一門(mén)后臺(tái)語(yǔ)言。
了解并掌握一門(mén)后臺(tái)語(yǔ)言据块，對(duì)一個(gè)前端開(kāi)發(fā)者來(lái)說(shuō)好處多多码邻。通過(guò)對(duì)后臺(tái)語(yǔ)言的學(xué)習(xí)，你可以了解數(shù)據(jù)庫(kù)技術(shù)的工作原理和應(yīng)用另假；更好的理解前后臺(tái)數(shù)據(jù)傳遞的本質(zhì)冒滩；在前端布局時(shí)，能夠更好的配合后臺(tái)開(kāi)發(fā)人員浪谴；當(dāng)然最高境界就是你可以自己完成前后臺(tái)的開(kāi)發(fā)开睡，也就是全棧工程師了因苹。正所謂“技多不壓身”嘛。學(xué)的越多篇恒，站得越高扶檐，看得越遠(yuǎn)，越能夠運(yùn)籌帷幄胁艰。
現(xiàn)在較流行的后臺(tái)開(kāi)發(fā)語(yǔ)言主要有三種：PHP款筑、JSP、ASP.net腾么。這三門(mén)技術(shù)都可以實(shí)現(xiàn)后臺(tái)所要求的所有功能奈梳。
數(shù)據(jù)庫(kù)方面主要包括MySQL、SQL Server解虱、Oracle攘须。
以上是個(gè)人總結(jié)的一些學(xué)習(xí)經(jīng)驗(yàn)，希望能給學(xué)習(xí)前端的伙伴帶來(lái)一些幫助殴泰！
動(dòng)手于宙，堅(jiān)持，相信你會(huì)變得不一樣的悍汛。
