HTML显示pdf格式的图片的方法

HTML显示pdf格式的图片的方法

在正常的html代码中，img标签是无法显示pdf格式的图片的，然而在我们投简历的时候最好的格式就是pdf格式，所用我们应该用相应的标签来显示pdf格式的图片

1，embed标签

embed 标签 – 定义网页中嵌入除图片外的多媒体，不过他不符合标准网页设计的理念,不赞成使用.embed标签已经被符合标准的object标签代替。

<embed src="${pageContext.request.contextPath}/admin/indexs/images/resume.pdf"
 type="application/pdf"  width="800px" height="2400px">

2，iframe 标签

iframe 元素会创建包含另外一个文档的内联框架（即行内框架），这里所说的内联框架指的就是达到类似于将代码插入到html文档中的效果。

<iframe src="${pageContext.request.contextPath}/admin/indexs/images/resume.pdf"
 width="800px" height="2400px"></iframe>

3，object 标签

object的标签是属于窗口类型的，浏览器解析的时候，会优先执行，网页用的嵌入脚本,用来播放flash文件的,object是指对象的意思

<object data="${pageContext.request.contextPath}/admin/indexs/images/resume.pdf"
 type="application/pdf" width="800px" height="2400px"></object>

4，iframe+object+a标签

双重保险，如果实在是没有也可以通过超链接来直接链接到你的图片地址

<object data="${pageContext.request.contextPath}/admin/indexs/images/resume.pdf" type="application/pdf" width="800px" height="2400px">
<iframe src="${pageContext.request.contextPath}/admin/indexs/images/resume.pdf" style="border: none;" width="800px" height="2400px">
PDFs无法正常显示，请您点击查看: 
<a href="${pageContext.request.contextPath}/admin/indexs/images/resume.pdf">View pdf</a>
</iframe>
</object> 

更完善完整的显示PDF格式图片的参考网址：https://pdfobject.com/