在一個項目里，UI設計師畫好圖，交給前端研發(fā)用代碼實現(xiàn)出來的頁面，不涉及復雜交互和數(shù)據(jù)處理，只是展示圖片文字等，一般就是招聘要求里說的靜態(tài)頁面。

要寫出一個靜態(tài)頁面，基本具備html，css的知識就能實現(xiàn)了。一些稍微復雜點的交互，如切換tab，相應的切換對應的內(nèi)容，或者鼠標移動到某個元素上，展示不同顏色等，這些需要具備一定的js知識（一般會用到jquery，不難）。

一、首先介紹一些基本的概念：

1. h5 、html5，在不懂代碼不做前端的其他職業(yè)口中，H5一般是指大家平時在朋友圈看到的那些分享出來的玩意兒，比如讓你填個表單，姓名年齡然后去算姻緣那種頁面。在前端這兒，html5是html的第五次修改后的版本。它是一種語言，超文本標記語言的一個修訂版本。

2. Css3  同樣，也就是css的進化版本。

3. Html 超文本標記語言，有兩大部分 head和body。Head主要包括meta（元信息，不懂沒事）、 title（頁面標題）、 link（用來引用外部css文件） script（用來引用外部js文件等，這個有點多，不了解沒關(guān)系），style（直接在本頁面寫css代碼，內(nèi)部css）等。

4. Body就是主體了，包含了我們在頁面里看到的內(nèi)容，一般像header tab article footer之類的都寫在body里面。

5. Css 名字是層疊樣式表（記不得沒事，我都不記得），理解成它是為了讓html好看的就可以了。

6. Html和css是什么關(guān)系呢，html就像一個人的本體，有骨骼有血肉皮膚，css就像這個人穿的衣服。不穿衣服的話，這個人能活，本質(zhì)是個人。但是裸奔總是不好的，為了不辣眼睛，就有了css，給它穿上衣服弄得好看點。

二、簡單示例