用markdown + html写一封简历

• 0. 前言
• 1. 阶段1 - 确定需要几个模块
• 2. 阶段2 - 使用纯文字填充简历
• 3. 阶段3 - 预留空格
• 4. 阶段4 - 文章垂直方向的调整
• 5. 阶段5 - 居中对齐
• 6. 阶段6 - 加图标

---

本文链接: https://www.cnblogs.com/hchengmx/p/10761179.html

0. 前言

简历的重要性

求职的实质是用最高的效率来找到匹配到适合的工作。而怎么快速的匹配呢? 就要有一份好的简历了, 我第一份简历是用word写的, 用word写的好处就是, 简单, 坏处是 太丑了。后来在网上找模板来写，好处是好看了一点，坏处是模板不一定适合自己，有可能用力过度，而且改模板很麻烦。后来学会了markdown, 就尝试用markdown来写简历。

下来我就来演示怎么用markdown + html来写一份简历。

我是用的vscode + 插件 markdown all in one。

---

1. 阶段1 - 确定需要几个模块

• 个人信息:

  • 照片: 不建议放上去，因为不好看了影响hr心情，一下子就fail掉，要是太好看了，还可能引起hr嫉妒也fail掉；
  • 居住地/户籍: 不需要，因为要是不在你期望的工作地点你肯定也不会投呀，写上这个是毫无意义的；
  • 民族: 不需要，因为用人单位也不关心这个啊；
  • 性别: 这个打电话或者面试就知道了，没必要写在简历里；
  • 出生日期：不需要，意义也不大，因为即便同年出生，各个人上大学和毕业也可能不一样，可以考虑换作工作年限；
  • QQ/微信: 不建议放上去，因为hr肯定先和你进行电话沟通，要是合适了才会主动加微信；

• 关键字: 很多人的简历中会有这个，但是个人并不推荐，因为可能会和下面的自我技能陈述重复。

• 我的技能: 详细说会什么技能。比如, 数据库:xxx,xxx; 开发语言: xxx,xxx;

• 求职意向: 到岗时间/目标技能(你希望面试什么样的职位)/行业(金融/投资/证券)/期望薪水(可以和hr打电话时候谈，但是要是面试的是初级/中级的话，这个不建议写在简历里面 ,因为面试自己的人并不定是自己的直接上司,也可能是未来同级的同事,直接说明可能会引起误解, 建议写成面谈)。

• 工作经验: 以时间倒序来写工作内容，包括 工作时间，工作描述，主要业绩。

• 项目经验：包括项目描述，职责描述。

• 教育背景: 以倒序排列。

• 社交主页: github/博客。

大概包括哪些东西设计好了，下来就是来设计整个简历了。

## 姓名

## 职位
邮箱/手机号/工作年限和职位

### 我的技能
数据库/开发语言/测试工具/测试类型

### 求职意向
到岗时间/期望薪水/行业/目标技能

### 工作经验
公司/工作时间/工作描述/主要业绩

### 项目经验
项目描述/职责描述

### 教育背景
大学/专业

### 社交主页
github/博客

---

2. 使用纯文字填充简历"

写出来以后, 虽然看起来简洁, 但是这要是打印成html的话, 是这样的, 是纯文字, 还是缺乏一点美感;

---

3. 预留空格

这一步需要预估一下自己需要的对齐方式, 为图标留出来的空间，在markdown预留出来空格还有图标的位置。

备注: 这一步非常重要, 因为这个时候不改的话, 等在html时候改会变得非常麻烦, html可读性也没有markdown可读性好, 而且markdown文件就和html文件失去了衔接。。这一步我是用的vscode的preview markdown功能, 一步一步的改，这个阶段完成以后是长这样

---

4. 文章垂直方向的调整

4.1 调整字体

使用vscode的插件，导出为html, 用markdown继续打开html文件，将字体切换为 ‘微软雅黑’。

body {
    font-family: "微软雅黑", Helvetica, "微软雅黑", Arial, sans-serif;
    font-size: 16.5px;
    line-height: 1.6;
}

4.2 调整边距

下来我们在浏览器中打开这个html文件，Ctrl + P 打印。这时候我们发现, 要是用默认设置的话，我们写的简历有可能并不是刚好填满整个页面的，要是截至是在页面中间，那就比较不美观。
我的做法是 1设置字体大小 2设置字体行间距 3调整打印的页面边距，尽可能的将简历填满整个页面。
字体大小和行间距的话，还是在body的css里面调整。

body {
    font-family: "微软雅黑", Helvetica, "微软雅黑", Arial, sans-serif;
    font-size: 16.5px;
    line-height: 1.6;
}

页面边距是在浏览器中调整，尽量让简历充满整个页面, 我们可以自定义页面边距。

---

5. 阶段5 - 居中对齐

5.1 居中

比如我希望最后一行代码居中。

<p>@2019 Made by Cheng Hang</p>

我是这样做的，先给他加上class属性，再用css设置文本居中。

    <p class="bottom">@2019 Made by Cheng Hang</p>

    .bottom {
        text-align: center;
    }

5.2 右对齐

我希望时间部分右对齐，不要用空格。比如这行代码

<p>上海xxxx有限公司    2017年7月 - 至今</p>

我是这样做的, 1把p标签改为span标签, 这样虽然他们变成了两个标签但是还是在一行。

<span>上海xxxx有限公司</span> <span class="time">2017.07 - 至今</span>   

再调整css, 让第二个span标签右对齐。

.time { 
display:block; 
float: right; 
margin-right: 150px;
}

---

6. 阶段6 - 加图标

我是用的font-awesome，官方网址在这里

1. 下载好font-awesome到当前文件夹;
2. 引入css文件;

<link href="./font-awesome-4.7.0/css/font-awesome.min.css"  rel="stylesheet" type="text/css">

3. 把占位的字符换成想要的图标代码, 大功告成。

<i class="fa fa-envelope"></i>

写完以后的简历就是像这样。

ps: 对于hr来说，一份简历最最最重要的信息就是三个，1姓名，2联系方式，3申请投递的职位，所以命名简历的时候最好是以这三个信息来命名简历。

---

本文希望对您有所帮助，如何问题可联系我的个人微信