邮箱名片模板分享
熊爷爷 2016-6-12 16:22:06
公司给的邮箱名片模板不是很好看,于是抽空写了一个响应式布局的模板,在各种设备下都可以正常显示。
可以拉伸一下窗口看看各种尺寸下的效果:
熊爷爷
Hubert Xie
自由职业|Freelancer
Mobile:(+86) 186-XXXX-7083
北京市朝阳区/东城区
教一下大家怎么用五分钟把名片修改成自己的:
- 复制以下代码,粘贴到纯文本编辑器中,找到关键字替换掉。
<div style="font-size:14px;font-family:Verdana;color:#000;"></div>
<div style="color: rgb(51, 51, 51); line-height: 21px; font-family: 'Lucida Grande', 'Lucida Sans Unicode', sans-serif !important;">
<div id="main">
<hr style="border: 1px dashed #dadada;">
<div>
<img src="你的图片.jpg" style="float:right;position:relative;right:30px;top:0px;width:103px;">
</div>
<div id="font" style="position:relative;left:30px;">
<b style="font-size: 18px;">熊爷爷</b>
<span style="color: rgb(217, 11, 0); line-height: 1.5;"> </span>
<span style="line-height: 1.5;"><font color="#4d4d4d"><b>Hubert Xie</b></font></span>
<div><font color="#4d4d4d"><b>自由职业|</b></font><b style="color: rgb(77, 77, 77); font-size: 13px; line-height: 1.5;">Freelancer</b>
</div>
<div style="line-height: 1.5; font-size: 13px;"><font color="#4d4d4d"><b>Mobile:(+86) 186-XXXX-7083</b></font>
</div>
<div><br>
</div>
<div>
<span style="color: rgb(103, 103, 103); line-height: 1.5;font-size: 13px;text-decoration: none;">北京市朝阳区/东城区</span>
</div>
</div>
<hr style="border: 1px dashed #dadada;">
</div>
</div>- 其中img src="你的图片.jpg"需要替换为你自己的二维码。在这里推荐一个很好用的Chrome插件——围脖是个好图床。安装插件之后登录微博,点击插件按钮,将你的图片拖入页面,瞬间就可以获得一个后缀为jpg/gif的图片URL链接。(这个URL可以很方便的在任何地方分享图片,比如在微信里分享gif图。)
- 打开QQ邮箱设置,找到『个性签名』并点击『添加个性签名』
- 点击『</>』,把里面原本的内容删光,粘贴进去我们刚才写好的模板。
- 点击『返回可视化编辑』,就能看到已经出现了你的名片。取个名字然后点击确定保存,以后写信的时候就可以用啦。
- 使用效果
