在html表格单元格中插入图片时，图片下边缘跟单元格边总是有一点空白，图片没法充满单元格
来源：3-1 表格布局（1）
Raymond0913
2017-09-27 21:30:32
预计效果
实际效果（第一行和第二行之间有空隙）
<!DOCTYPE html> <html> <head> <title>作业</title> <meta charset="utf-8"> </head> <body> <table align="center" width="876px" border="0" background="作业/images/bg.gif" cellpadding="0" cellspacing="0"> <tr> <!--<td colspan="12" background="作业/images/bg-up.gif" height="60px"><img src="作业/images/logo.gif"></td>--> <td colspan="12" height="60px" border="0" cellspacing="0"><img src="作业/images/logo.gif"><img src="作业/images/bg-up.gif"><img src="作业/images/bg-up.gif"></td> </tr> <tr> <td align="left"><img src="作业/images/left.gif"></td> <td align="right" colspan="11"><img src="作业/images/right.gif"></td> </tr> <tr> <td width="255px" height="150" background="作业/images/girl-1.gif"></td> <td rowspan="3" width="40">1</td> <td rowspan="3" width="40">1</td> <td rowspan="3" width="64">1</td> <td rowspan="3" width="58">1</td> <td rowspan="3" width="58">1</td> <td rowspan="3" width="58">1</td> <td rowspan="3" width="58">1</td> <td rowspan="3" width="58">1</td> <td rowspan="3" width="58">1</td> <td rowspan="3" width="58">1</td> <td rowspan="3" width="73"><img src="作业/images/title.gif"></td> </tr> <tr> <td width="255px" height="128px" background="作业/images/girl-2.gif"></td> </tr> <tr> <td width="255px" height="131px"><img src="作业/images/girl-3.gif"></td> </tr> <tr> <td colspan="12" background="作业/images/bg-down.gif" height="60px"></td> </tr> </table> </body> </html>
写回答
3回答
-
惟乂
2017-09-28
width设置成100%试试
1 -
小丸子爱吃菜
2017-09-29
因为你写的demo涉及大量的图片，我们再进行测试时无法正常的显示效果，所以测试不出来你所说的效果。
我们打开你的代码后就是这样的效果：
建议你将图片换成元素内容，写一个没有图片的demo，这样我们能正常调试问题，好能够更准确的定位到问题！
祝学习愉快！
0 -
澜沙问风
2017-09-29
如果学完课程我没有记错的话，border、cellspacing和cellpadding属性只放在table标签里，你放在td里有没有影响？
不如设置table标签的border值为1，放大看看空白在那个块里。再去找解决方法。
0
相似问题