凡事略懂程序猿读书

markdown生成一份html简历

2016-09-30  本文已影响14044人  一口咖啡一口茶

最近正在找新工作,翻出以前写的word简历,真的是,往事不堪回首。觉得自己以前一定是脑子秀逗了,写出来的简历,花里花俏,完全前言不搭后语。而markdown这样简洁方便的格式非常适合我整理出一份简洁明了的简历。所以,我打算试下。

并且我还希望,这份简历是可以到处pdf,打印出来的。

献上结果:
http://yieldblog.me/resume.html

导出pdf

结构

前端设计哲学:

先整体,后细节。

一个简历也是这样,必须要有清晰的整体结构。让用人单位一幕了然,不需要过多的修饰,那样不会是锦上添花,而是画蛇添足。所以,我最直观的想到了这个页面的结构。

# 姓名
## 职位
> 联系方式

### 关于我
/* 列举一下个人优势和特点 */

### 工作经历
/* 工作的经历和工作内容,注意要时间倒序 */

### 教育经历
/* 学校和专业等信息 */

### 技术经历
/* 不要单纯列出一堆技术名词,而是明确自己做过的事情,这样面试官比较容易对我的技术有个初步判断 */


细节

大体页面出来之后,填上内容。内容的时候,注意是使用有突出重点,要活用**Text**(加粗)和 ***Text***(斜体)。

同时给每个段落加上分割线,更好的区分。

然而,你会发现markdown写出来的简历虽然简洁,但是缺乏一些有趣的东西。比如:


例图

你会发现,你如果要实现这样平行的效果,这个时候,markdown的任务就结束了,要美化这个页面,就要上html+css了。

导出html

要导出html,我推荐使用一个在线工具。http://mahua.jser.me/

美化

修改字体

首先将导出的css里面的字体设为“微软雅黑”:

body {
    font-family: "微软雅黑", Helvetica, "微软雅黑", Arial, sans-serif;
    font-size: 13px;
    line-height: 18px;
    color: #737373;
    margin: 10px 13px 10px 13px;
}

为什么用微软雅黑,因为兼容性好,打印出来效果没有偏差。

调整边距

调整页面的边距大小,尽量是内容在一个A4纸页面上。而如何知道是否在一个A4纸呢?

在Chrome浏览器下,Ctrl+P打印页面,把目标打印机改为pdf,纸张尺寸为‘A4’,你就可以看你调整的效果是否,超出了一个页。

font awesome

有些东西的叙述,我们可以使用iconfont来代替。我使用的是font awesome。这样的库很多,你可以按自己的喜好使用。

总结

写出了一份简历的同时,还锻炼我的前端技能。

ps: 有合适工作的,发邮件联系我。

上一篇下一篇

猜你喜欢

热点阅读