我舉個例子吧，假如你要修一間房子。

那麼，首先，你需要確定房子的結構：1.是方的、圓的還是其他形狀的？2.平頂的還是斜面的？

其次，假如房子修好了，你想要什麼樣的裝飾？

而HTML和CSS就是用來解決這兩步的，HTML決定了網頁的結構(（也就是所謂的佈局），CSS決定了網頁的樣式（顏色、動畫效果等）。

首先，看一下它們的概念。

超文字標記語言（英語：HyperText Markup Language，簡稱：HTML）是一種用於建立網頁的標準標記語言。HTML是一種基礎技術，常與CSS、JavaScript一起被眾多網站用於設計網頁、網頁應用程式以及移動應用程式的使用者介面[3]。網頁瀏覽器可以讀取HTML檔案，並將其渲染成視覺化網頁。HTML描述了一個網站的結構語義隨著線索的呈現，使之成為一種標記語言而非程式語言。

層疊樣式表（英語：Cascading Style Sheets，縮寫：CSS；又稱串樣式列表、級聯樣式表、串接樣式表、階層式樣式表）是一種用來為結構化文件（如HTML文件或XML應用）新增樣式（字型、間距和顏色等）的計算機語言。

所以，現在基本上你能看到的網頁都離不開HTML和CSS，這是因為目前絕大多數的主流瀏覽器都能夠很好的解析渲染HTML和CSS，並且隨著網際網路行業的發展，HTML和CSS的屬性越來越豐富，所支援的型別也越來越多，可以說，HTML和CSS是目前網路上介面展示的不二選擇。

豐滿的介面展示和良好的使用者體驗都離不開HTML和CSS的支援。

當然，只有HTML和CSS搭建的網頁或許會很漂亮，但是缺少靈魂——JavaScript（簡稱JS），JS負責的是網頁中元素之間的互動，JS使得網頁更加的生動和多樣。

JavaScript（通常縮寫為JS）是一種高階的、解釋型的程式語言[5]。JavaScript是一門基於原型、函式先行的語言[6]，是一門多正規化的語言，它支援面向物件程式設計，指令式程式設計，以及函數語言程式設計。它提供語法來操控文字、陣列、日期以及正則表示式等，不支援I/O，比如網路、儲存和圖形等，但這些都可以由它的宿主環境提供支援。它已經由ECMA（歐洲計算機制造商協會）透過ECMAScript實現語言的標準化[5]。它被世界上的絕大多數網站所使用，也被世界主流瀏覽器（Chrome、IE、Firefox、Safari、Opera）支援。

HTML、CSS和JavaScript是前端的基礎，靈活使用它們可以構建出豐富多樣的網頁。而它們的應用範圍極其廣闊，尤其是在前端高速發展的今天，它們三個足以撐起前端行業的半邊天。