- 來到這篇博客的你多多少少對前端是喜歡的，不要否認（鬼臉）< _ >
- 有很多同學想踏入前端這個神奇而又神奇的隊伍，但又不知從什么地方開始學習（盤）前端知識，在這里簡單的提供一些建議和學習資料，希望各位同學從入門到提升（bu shi fang qi）!
- 前端需要掌握的知識體系大致為： CSS(3)、HTML(5)、JavaScript、jQuery、node.js、Vue/React/Angular三大前端框架、webpack/gulp等前端工程化工具、小程序開發等，但所有的基礎都離不開CSS、HTML以及JavaScript
- 如果將一個頁面（應用）作為一個人來說，HTML便是人的骨架（頭、胳膊、手臂、腳等），CSS是人的外貌（膚色、身高、體重等），而javascript則為人的行為（靜止、走、跑、哭、笑等）！是不是已經明白三者之間的關系了，那就讓我們詳細了解這個零件是怎樣組合起來的。
HTML
超文本標記語言（英語：HyperText Markup Language，簡稱：HTML）是一種用於創建網頁的標准標記語言。HTML是骨架，顧名思義就是起支撐整個軀體的作用。
相關教程可以參考菜鳥教程-HTML
CSS
層疊樣式表（英語：Cascading Style Sheets，簡寫CSS）,CSS是對骨架HTML的修飾作用，想想如果沒有膚色、身高、體重等體征的骨架是多么怕怕~~
相關教程可以參考菜鳥教程-CSS
JavaScript
層疊樣式表（英語：Cascading Style Sheets，簡寫CSS）,有了骨架HTML和樣式修飾CSS之后還是遠遠不夠的，我們總想着有一個具備行為能力的人陪着我們，而不是一張照片，所以我們就得嘗試着讓照片動起來，這個時候就需要JavaScript出現來滿足我們孤獨的內心。
相關教程可以參考菜鳥教程-JavaScript
舉一個HTML+CSS+ JavaScript簡單的🌰，嘗嘗鮮：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Hello World!</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
.hello{
color: red;
}
</style>
</head>
<body>
<h1>Hello World!</h1>
<h2 class="hello">添加樣式</h2>
<button id="btn">點擊我</button>
<!-- js需要在文檔加載完成后引入，不然無法綁定事件，因為找不到元素 -->
<script>
document.getElementById('btn').onclick = function(){
this.innerHTML = '我被點擊了'
}
</script>
</body>
</html>
jQuery
jQuery is a fast, small, and feature-rich JavaScript library.這是官網給出的解釋。jQuery 是一個 JavaScript 庫，極大地簡化了 JavaScript 編程。
相關教程可以參考jQuery官網 菜鳥教程-jQuery
例如上面🌰中的點擊事件，jQuery這樣實現，是不是很簡單～
$( "btn" ).on( "click", function( ) {
$(this).html('我被點擊了);
});
基礎知識先可以准備這些，牢固的地基是穩步前進的基礎！后續再添加更多學習技能學習途徑。有急需了解的可在評論區留言，酌情添加新文章共同學習！