寫給前端初學者，如何學好 JavaScript 和 CSS

引言

在這個時代，我認為編程比以往任何時候都更受歡迎。人們辭掉工作，學習編程，然後將前端開發職位作為第二職業的情況並不少見。

前端開發是一個非常具有吸引力的職業，原因有很多：高需求，高薪水，任何人都可以在網際網路上免費 (或賺一點錢) 學習前端技術。

本文寫給即將邁入第二職業的朋友，希望能對幫助您更好的學習前端知識有所指引幫助。

本文假定您已經對 HTML 、CSS 和 JavaScript的概念有所了解。

如何學好 CSS

學好盒模型

理解盒子模型是如何使用 CSS 設計進行工作的基礎。

每個 HTML 元素，都可以看作是一個由內容、填充、邊框和邊距組成的矩形框。

box 模型適用於所有 HTML 元素，它本質上是一個包裹元素的盒子 (box)。首先，我們需要將每個 HTML 元素看作一個矩形或方框。

例如下面的圖就是一個和模型，您可以找些資料具體了解一下：

您可以嘗試將 CSS 添加到頁面來看看效果

可以用幾種不同的方式向頁面添加CSS ，每種方式都有其優缺點。有這麼幾種方式可以將 CSS 添加到頁面上：

• 內聯樣式，直接寫在 HTML 元素上
• HTML 中 添加 style 標籤
• 保存成外部樣式表，在 HTML 中引用
• 樣式表中也可以用 @import 導入其它樣式表

深入學習 CSS 的選擇器

選擇器是 CSS 中最重要、最強大的部分之一。它們本質上是一種模式，用於允許我們根據元素的類型、屬性甚至文檔中的位置來選擇要樣式化的元素。簡單來講，選擇器就是幫助我們精準找到要應用樣式的 HTML 元素。

如何學好 JavaScript

學習前端開發的最大困難，可能是需要您擁有紮實的 JavaScript 編碼能力。大多數前端開發工作面試都涉及大量的 JavaScript 代碼編寫以及對基本概念的深刻理解。

但是學習 JavaScript 可能會讓人望而卻步，因為有太多的資源可供選擇。

如果您是一個初級前端開發人員，請多查閱相關的前端開發技術手冊。這是對前端開發的一個很好的介紹，並對相關技術進行了詳細的解釋。

由於 JavaScript 概念比較多，更重要的是它是一門完整的語言體系，所以本文不會羅列 JavaScript 您應該會什麼、學什麼，請完整的閱讀一本 JavaScript 基礎教程，了解它的構成，這也許才是您最初需要的。因此我們會給您介紹一些學習資源的獲取途徑。

網絡課程

學習 JavaScript 最好的方法是通過練習，因此在線的網絡課程提供了一個很好的學習環境，根據課程一點一點練習。

許多網站都提供免費課程。

關注一些專業領域的人

經常去頭條、博客、專業性網站關注一些前端開發人員，他們製作的教程是他們多年的工作積累，非常實用，如果您是初學者，看不懂沒關係，可以將它們收藏，作為您日後的知識儲備。

選一些好書

看書是獲取知識最直接的途徑，選一本好書非常重要，但您最少有一本基礎的、系統的教程，它能幫助您梳理知識重點。

隨著您學習階段的上升，書籍的選擇也會不一樣，選書之前可以先大概過一下目錄，再看看評論。

這裡給您推薦一本比較不錯的書 《JavaScript 高級程序設計 (第3版) 》。

學習框架和類庫

我強烈建議在了解框架或庫之前，先學習 JavaScript 的所有基礎知識和內在細節。

通常，開發人員在學習 React 或 Vue 時並不了解底層發生了什麼，所以這些更應該被視為 JavaScript 之旅的第二步。

當您不能確定要選擇什麼框架學習的時候，不妨打開招聘網站，搜索一下各個企業需要的前端技術。

面試

您也可以嘗試多去些企業面試，看看企業中的前端開發都需要您了解和掌握什麼，然後再找到自己的不足。

總結

學習前端並不難，但要精通是一個漫長的過程。

首先您要找對學習方法，堅持不懈努力，自學過程中一定不要三天打魚兩天曬網，那會非常的耽誤時間。

從簡單的入手嘗試寫代碼，不理解的話，可以在網上搜索一些相關答案，即便是照著寫，也要做出一個完整的功能。但在這過程中，如果您確實不理解，可以暫時跳過，不要過於糾結。

當您根據教程做出一些小功能時，會很有成就感，這是對您自學極大的鼓勵，可以增加自信心，然後慢慢找方法學習，培養興趣。

至於找工作一定要相信自，不能認為自己是初學者就自卑，初學者不等於學不會、理解差。

文章中的圖片來源於網絡，若有侵權行為，請在後臺與我聯繫。