快速生成A4规格的小学生名字卡

上小学了，提前得知需要制作名字卡放在孩子书桌上，结果几天工作下来都没有时间制作，只能用HTML写一个用来临时打印一个，再用彩笔装饰一下就好了。

于是写好了一个放在了这里（假设孩子叫“张三丰”），用浏览器打开后，修改名字就修改URL name=张三丰 那部分再按个回车就行了。

把网页打印，会先看到一个预览如图所示：

我用照片纸打印了一下，找到中线对折一下，双面胶一粘贴搞定。希望有人能用上吧。如果连接失效了，那就自己写一个吧，代码附上：

<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8"><title>名字卡</title><style>@media print {body {margin: 0;text-align: center;}}.center-of-page {width: 100%;text-align: center;}.name-card {font-family: "Yuanti SC", Helvetica, Tahoma, Arial, "PingFang SC", "Hiragino Sans GB", "Heiti SC", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;font-size: 24vw;padding: 3vw;}.rotate-180 {transform: rotate(180deg);}.closer {background-color: aliceblue;height: 25vh;font-size: 5vw;color: gray;}</style>
</head>
<body><script>var urlData = new URLSearchParams(document.location.search);
</script>
<div class="closer center-of-page">胶水封口处</div>
<div class="name-card rotate-180 center-of-page"><script>document.write(urlData.get('name'))</script>
</div>
<div class="name-card center-of-page"><script>document.write(urlData.get('name'))</script>
</div>
<div class="closer center-of-page">胶水封口处</div></body>
</html>

其中字体还是用中文兼容性比较好的 font-family: "Yuanti SC", Helvetica, Tahoma, Arial, "PingFang SC", "Hiragino Sans GB", "Heiti SC", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif; 来处理吧。其中第一个是我本地想用的“圆体”。

有问题请留言，有BUG请留言。

小学生名字卡（HTML版可打印）相关推荐

绿联扩展坞拆解_拆解报告：UGREEN绿联3A1C四口多功能扩展坞（带SD卡槽版）
拆解报告:UGREEN绿联3A1C四口多功能扩展坞(带SD卡槽版) 2019-12-24 16:09:36 6点赞 7收藏 2评论 UGREEN绿联最近推出了新款USB-C多功能扩展坞,但是为了给用户 ...
C#版OPOS打印(基于北洋OPOS SDK二次开发包,支持EPSON和北洋、佳博、商祺等支持标准ESC/POS指令的POS打印机)
C#版OPOS打印基于北洋OPOS SDK二次开发包,支持EPSON和北洋.佳博.商祺等支持标准ESC/POS指令的POS打印机支持并口,串口,网口,USB口,驱动方式等多种端口支持开关钱箱 ...
c# 中崎_C#版OPOS打印(基于北洋OPOS SDK二次开发包,支持EPSON和北洋、佳博、商祺等支持标准ESC/POS指令的POS打印机)...
C#版OPOS打印(基于北洋OPOS SDK二次开发包,支持EPSON和北洋.佳博.商祺等支持标准ESC/POS指令的POS打印机) 收藏 C#版OPOS打印基于北洋OPOS SDK二次开发包,支持 ...
集合到文件文件到集合点名器集合到文件数据排序版标准输入流打印流对象序列化流对象返序列化流 Properties 游戏次数进程和线程线程多线程的实现方式设置和获取线程名称
文章目录集合到文件文件到集合点名器集合到文件数据排序版标准输入流打印流对象序列化流对象返序列化流 Properties 游戏次数进程和线程线程多线程的实现方式设置和获取线程名称 ...
程序员的浪漫-用她的名字作画Python版
程序员的浪漫-用她的名字作画Python版 hello,大家好,我是一灰灰,之前介绍了一篇使用她的名字来画出她的美图的文章,其中主要使用的Java来实现的,今天呢,我们再来用Python来实现一下同 ...
需求说明定义一个超市会员类属性名字会员号余额积分打印名字会员号余额和积分充值的方法余额要累加输出一下余额消费的方法余额减积分累加每消费10元
package homework; /* * 超市会员类属性名字会员号余额积分打印名字会员号余额和积分充值的方法余额要累加输出一下余额消费的方法余额减 ...
小马哥-----高仿红米note H19ST 单卡4G版拆机主板图与开机界面图面面观
高仿红米note单卡 4G版拆机主板图与救砖后开机界面图展示
小学生计算/口算题excel打印版，计算机出题，解放大人
[推荐]2019 Java 开发者跳槽指南.pdf(吐血整理) >>> 老师要求孩子练习数学口算题,网上找了几个出题软件,感觉不是很满意,特别是打印格式十分不爽正好闲来无事,现学现 ...
android 6.0.1 精简,国行公开版Note4 N9100ZCS1DPK1 Android 6.0.1 精简卡刷版
基于国行Note4公开版N9100ZCS1DPK1精简制作原生内核不含基带精简Knox.三星共享.打印等应用 Deodexed Rooted 添加Busy Box 添加init.d支持 Supe ...

小学生名字卡（HTML版可打印）

幼儿园名字卡

快速生成A4规格的小学生名字卡

小学生名字卡（HTML版可打印）相关推荐

最新文章

热门文章