我尝试了此代码，但我的3个图像之间仍然有一个小空格

顺晟科技

2021-08-03 10:51:14

174

我尝试了这个代码，但我仍然有一个小空格之间的我的3个图像，我应该添加更多的删除这些空格。下面是代码

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>img_test</title>
<style type="text/css">
    
    table {
        border: none;
    border-collapse: collapse;
            }
</style>
</head>

<body>
    <table width="auto" border="0" border-spacing="0" cellspacing="0" cellpadding="0">
  <tbody>
    <tr>
      <td><img src="Sans titre-1.jpg" alt="" height="auto" width=""/></td>
    </tr>
    <tr>
      <td><img src="Sans titre-1.jpg" alt="" height="auto" width=""/></td>
    </tr>
    <tr>
      <td><img src="Sans titre-1.jpg" alt="" height="auto" width=""/></td>
    </tr>
  </tbody>
</table>

</body>
</html>

顺晟科技：

将行高：0添加到TD

table td {line-height: 0;} <!doctype html> <html> <head> <meta charset="utf-8"> <title>img_test</title> <style type="text/css"> table { border: none; border-collapse: collapse; } </style> </head> <body> <table width="auto" border="0" border-spacing="0" cellspacing="0" cellpadding="0" > <tbody> <tr> <td><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/1/11/Test-Logo.svg/1175px-Test-Logo.svg.png" alt="" height="auto" width=""/></td> </tr> <tr> <td><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/1/11/Test-Logo.svg/1175px-Test-Logo.svg.png" alt="" height="auto" width=""/></td> </tr> <tr> <td><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/1/11/Test-Logo.svg/1175px-Test-Logo.svg.png" alt="" height="auto" width=""/></td> </tr> </tbody> </table> </body> </html>

这样做的方法之一是将表中的图像作为块级元素。这将删除空白，请尝试以下操作:

<!doctype html> <html> <head> <meta charset="utf-8"> <title>img_test</title> <style type="text/css"> table { border: none; border-collapse: collapse; } table img { display: block; } </style> </head> <body> <table width="auto" border="0" border-spacing="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td><img src="https://picsum.photos/200" alt="" height="auto" width="" /></td> </tr> <tr> <td><img src="https://picsum.photos/200" alt="" height="auto" width="" /></td> </tr> <tr> <td><img src="https://picsum.photos/200" alt="" height="auto" width="" /></td> </tr> </tbody> </table> </body> </html>

ps:如果您纯粹是为了设计而使用表，那么请不要使用。使用<div>并相应地设置样式。当您进行移动响应时，您会非常高兴使用了<div>。<table>应用于显示数据，而不是用于设计目的。

上一篇：如何使用数组中的数字来决定选中的无线下一篇：python库资源大战转载地址:ht

网站建设

Html

我尝试了此代码，但我的3个图像之间仍然有一个小空格