**：heero.luo
2023年中，因為換工作面試的需要，我得更新舊的簡歷。但是在word中排版實在是各種不順手，於是就發揮了作為前端工程師的優勢把簡歷做成了網頁；2023年末想換工作時又對其進行了改版。這份簡歷曾經受到好幾位hr和獵頭的好評，所以特地分享製作經驗，也算是給想換工作的同行參考。
進入正題之前，先想想html簡歷的好處：
可以採用更豐富的設計和更靈活的排版。
可以通過超連結訪問其他資源。
可以順帶展示自己設計以及前端方面的技能。
而在此基礎上，我還給這份簡歷定下了以下目標：
好了，下面具體講講如何打造這樣乙份簡歷。
很多程式設計師會喊：「我是寫**的，不懂設計。」但俗話說得好：沒吃過豬肉，總見過豬跑吧。平時逛這麼多**，難道沒有幾個特別順眼的？現在瀏覽器的開發工具非常先進，看上哪個直接扒過來「參考」就行。像簡歷這種簡單頁面也不需要先做psd稿，構思好之後直接寫html和css更為方便。
設計時應盡量使用圖形、影象表達內容，這是因為相比大段的文字，人更喜歡看圖。這裡也貼一下我簡歷中其中一節改版前後的對比（左舊右新）：
相比左側大段密密麻麻的文字，右側的柱狀圖讓人一眼就能看清技能水平。
這年頭顯示器越來越大，相對地文字就越來越小，現在大部分**都把標準文字大小設為14px。考慮到簡歷的內容不多，排版可以寬鬆一些，因此建議把標準文字大小設為16px，這在螢幕尺寸較小的移動裝置上看起來也不會那麼吃力。
簡歷的受眾是誰？無非是兩類人：hr以及技術工程師。可以確定的是，技術工程師基本上是用chrome或者firefox的好同志，並且非常鄙視ie。hr常年耳濡目染，也會逐漸地換上新的瀏覽器。然而，考慮到那小部分的hr以及極小部分的技術工程師的感受，還是準備一段「溫馨」的提示吧：
實現方法很簡單，通過條件注釋對ie 9.0以下版本的瀏覽器，直接用iframe套個提示頁面去把原頁面擋住：
這一步主要是為了避免被各種騷擾**、垃圾郵件的掃號軟體掃到，這裡說的加密並不需要做得很複雜，只要稍微加一點干擾因素即可。比如你的qq號是1234567，那麼在網頁上可以這樣輸出：
email: 簡單製作網頁分享按鈕
話說這是乙個人際互聯的時代，sns 類的社交網路大行其道。頁面作為一種資源怎麼不會參與到社交網路的分享中呢？於是我們看到頁面都會提供乙個分享功能，如我正在寫的 csdn 博文，出來就會有 雖然現在有不少服務是專門做些分享按鈕的，功能比較強大，包括統計的功能也有，但 google 一番之後，發現其原理...
div css製作網頁經驗技巧集錦
讓你使用div css排版 不是讓你用換個標籤然後再去按照 的方式去排版而是做到內容與表現的分離。1 id用於標識頁面單獨元素以及持久行的結構性元素 方便js的呼叫 類用於標識同一頁面可重複定義使用的結構性元素 id與類的命名需與表現形式無關 leftcontent 而使用有意義的定義方式 side...
網頁製作案例2 個人簡歷製作
目錄 知識點 效果圖 分解圖 主要思路及步驟 布局 巢狀 css樣式 特殊符號 1 插入背景 2 插入 8行1列 605畫素 邊框粗細0 單元格邊距0 單元格間距3 3 第三行 拆分2列 4 第三行 第一列單元格 寬330,高170 第二列寬 266 第一列中插入 巢狀 6行2列 寬度80 邊框粗細...