怎样在保证网页样式的情况下打印网页

[sd4399340]

做了个简历的网页版，想打印，但用chrome自带的打印工具样式完全乱了

其实主要是想生成PDF

求解

[yinxingren]

网页整体截图，直接打印图？

[sd4399340]

@yinxingren 这个我也想过，主要是简历，全图片的话不太好~

[gouflv]

各个浏览器对打印的支持都不一样, 推荐用pdf

[sd4399340]

@yinxingren
@gouflv

我的需求就是想最终弄成pdf，就是怎么在保证样式的情况下html->pdf

[hanai]

。。。你需要打印样式 print.css

[hewigovens]

试试wkhtmltopdf

[cougar]

打印样式可以由css控制，就是单写一个print属性的css文件

media="print"

查查手册

[learnshare]

针对 print 写 CSS 的方式我没试过效果如何，但 Chrome 另存为 PDF 的功能不太能做出完美的东西。

[fanpenghua]

貌似只能些兼容性CSS， 还有个办法 网页截图，再打印

[jaylong]

截取到EverNote里再打印

[zmchary]

正好前几天也在尝试怎样用CSS来设计打印的样式，但是在Chrome的打印下，自动分页效果不好，并且无法控制分页的上下页边距，尤其是背景不是白色的情况下（如果背景是白的，直接通过打印机设置调整就好了）。

不过，不建议用css来控制打印，毕竟不是为打印排版设计的。

刚试了一下网页截图成PDF，效果还不错，还省去了调整。

[P233]

用 @media print 没错，我也这样折腾过简历，效果没错

建议1：responsive design & href="tel:XXXXXXXXX" 点击链接直接拨打电话

建议2: 附上 .vcf 文件下载链接

建议3: onclick='window.print()' 让 hr 随时打印本页

[sd4399340]

@hanai
@cougar
@P233

感谢~我有用 responsive design，宽度变小时页面结构会相应小变化，我感觉用 media print也是同样的道理，关键是我不是想隐藏什么东西，我就想让看到的样式能完整的打印下来啊

试了不少方案，有点想放弃了，我觉得这需求没法满足，还是单独做一份pdf方便hr打印下载吧

[zangbianxuegu]

用 media="print" 单独写打印样式，或者干脆不写 media。如果写了 media="screen"，打印没有样式。