表格中插入图片，图片显示未达到预期效果

问题遇到的现象和发生背景

插入到表格的图片不受表格宽度的限制，有没有办法让图片的大小跟随表格的大小变化？另外，给图片加了高度的限制之后，图片没有填满表格有间隙，有什么办法把这个间隙给弄掉？

问题相关代码，请勿粘贴截图

<table border="1" width="500" align="center">
        <tr>
            <td>姓名</td>
            <td>张三丰</td>
            <td>性别</td>
            <td>男</td>
            <td rowspan="3"><img src="img/4.png" height="200"></td>
        </tr>
        <tr>
            <td>年龄</td>
            <td>108</td>
            <td>电话</td>
            <td>186888886666</td>
        </tr>
        <tr>
            <td>邮箱</td>
            <td colspan="3">12345678@qq.com</td>
        </tr>
    </table>

运行结果及报错内容

写回答
好问题 0 提建议
追加酬金
关注问题
分享
邀请回答
编辑收藏删除
收藏举报

2条回答默认最新

神仙别闹 2022-01-04 11:49

关注

给你的td,也就是单元格设定width后，图片的width和height都设置成100%

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <table border="1" width="580px" align="center">
        <tr>
            <td style="width:80px;">姓名</td>
            <td style="width:160px;">张三丰</td>
            <td style="width:80px;">性别</td>
            <td style="width:160px;">男</td>
            <td rowspan="3" style="width:200px;"><img src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp0.meituan.net%2Fdpdeal%2F1664f008b8babea851d1cd64349d933b485992.jpg&refer=http%3A%2F%2Fp0.meituan.net&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1643860279&t=812f21f3ae45232d9b7f21de48728b8d"  style="width:100%; height:100%"></td>
        </tr>
        <tr>
            <td>年龄</td>
            <td>108</td>
            <td>电话</td>
            <td>186888886666</td>
        </tr>
        <tr>
            <td>邮箱</td>
            <td colspan="3">12345678@qq.com</td>
        </tr>
    </table>
</body>
</html>

本回答被题主选为最佳回答 , 对您是否有帮助呢?

编辑记录

查看更多回答(1条)

报告相同问题？

关注问题

表格中插入图片，图片显示未达到预期效果 html java
2022-01-04 11:40

回答 2 已采纳给你的td,也就是单元格设定width后，图片的width和height都设置成100% <!DOCTYPE html> <html> <head> &l
java excel表格如何转化为图片显示出来 java
2017-06-27 07:17

回答 2 已采纳是要实现在线预览么？用flashpaper http://download.csdn.net/detail/abc20072349/8752289 http://download.csdn.net
表格里插入图片 会跑到表格上面去 css css3 html5
2021-01-11 20:21

回答 2 已采纳给img添加display：block
【PDF添加印章】Java在PDF中添加指定尺寸大小的图片印章
2022-08-13 21:51

Nonoas的博客如何使用itext在PDF中添加指定尺寸大小的图片印章
react中让表格中图片单击放大预览 react.js 前端有问必答
2021-12-20 16:51

回答 2 已采纳 table渲染的时候 render 直接 image 组件渲染就行了啊
java统计excel表格中的人数 java
2023-04-03 09:06

回答 3 已采纳要统计Excel表格中最后两列的人数，并且保证没有相同的人数，可以使用Java中的Apache POI库来读取Excel文件并实现该功能，举个栗子 import java.io.FileInputSt
java poi 如何在doc模板中插入富文本 java 有问必答
2021-06-10 16:09

回答 2 已采纳题主说的需求恐怕实现不了，将html标签显示到doc上，doc不会编译HTML标签（标签只会原样输出），如果是想显示效果，那只有自己用POI类去编写跟富文本编辑器相同的效果，然后通过poi导出到d
java使用模板导出excel，带二维码，图片及图片压缩
2020-09-02 19:36

zhx0114的博客先上效果图吧需求就是如上图的样式导出excel，第一列是根据第二列内容生成的二维码，最后一列是数据关联的附件图片模板如下图：模板中以{{$fe:开头，dataList为后台传递Map<String,List>数据时写的...
如何在背景图片里面插入表格。 html5
2022-10-31 16:45

回答 2 已采纳 css为元素添加背景，然后平铺就行像下面这样： div { width: 450px; height: 360px; background: url(img/2.jpg) re
如何使用Java生成Word文档，包含章节段落、图片、visio、表格等？ apache java xml 有问必答
2021-10-27 13:50

回答 2 已采纳 java中并没有一个对于office相关产品的操作库；通常都是分开处理的；建议，可以使用不同的库来操作不同的文档
vue中在表单中显示服务器中的图片 elementui node.js vue.js
2021-05-20 13:44

回答 2 已采纳这个容易，按如下代码即可实现： <el-table-column label="书籍图片" width="160" align="center"> <template
基于Java+Springboot+vue在线版权登记管理系统设计实现
2023-03-20 08:03

java李杨勇的博客 IDEA平台是开源的，具有功能强大、可扩展性强等特点，可以应用于C/S模式软件的开发，但是它所占据的内存容量比较大，运行较慢，并且其并未提供Tomcat服务器，运行过程中需要将代码发布到Tomcat服务器中，测试使用的...
vue表格中嵌入下拉框第一次赋值不显示 java vue.js
2021-05-26 20:15

回答 1 已采纳这是因为数组动态添加的时候数据变化没有检测到，用$set这个api就可以解决
POI导出word文档表格跨行跨列和word文档中加图片浏览器下载
2020-08-01 11:18

城建小鋼炮的博客个人尝试出的方法如果有误差见谅 poi导出word文档需要的jar包 poi-3.9-20180503.jar poi-examples-3.9-20180503.jar poi-excelant-3.9-20180503.jar poi-ooxml-3.9-20180503.jar ...* 设置表格样..
java面试大全（7w字,更新中）
2023-04-10 14:48

Java狂魔哥的博客 Java中提供了两种动态代理方式：基于接口的动态代理和基于类的动态代理。基于接口的动态代理是通过Java的反射机制在运行时创建一个实现了指定接口的代理类，而基于类的动态代理是通过继承一个指定类来创建代理类。 ...
没有解决我的问题, 去提问