如何删除 HTML5 中 之间的空格?
2024-02-09


我使用下面的代码将 SVG 嵌入到 HTML5 中。现在我唯一无法解决的问题是之间有很大的空间<svg><td>当在浏览器中查看 HTML 文件时。有人可以告诉我如何删除空格吗?

先感谢您!

更多细节:

抱歉,我忘了说我使用的是哪个浏览器。我发现当我使用IE9时,SVG和左右栏之间有很大的空间。但是,当我使用 Chrome 时,SVG 与顶部和底部栏之间有很大的空间。这很奇怪。

我编辑下面的代码。我加 svg {边距顶部:0px; 下边距:0px; 右边距:0px; 左边距:0px;背景颜色:黄色;}

在代码中。我想做的就是删除黄色空间。现在问题变得更加具体。


<!DOCTYPE html><html>
<head>

<title>SarShips: scs</title>
<style type="text/css">

table 
{
border-collapse:collapse;
}
table, td, th
{
border:1px solid black;
}

table {margin-left:auto;margin-right:auto}
tr.odd {background-color:#E0E0F0}
tr.even {background-color:#F0F0FF}
th {font:22px sans-serif;background-color:#98AFC7;color:white;padding:6px}
td.e {font:bold 15px serif;text-align:right;padding:4px}
td.v {font:15px monospace;text-align:left;padding:4px}
td.i {padding:4px}
p {text-align:center}
      svg {margin-top:0px;
           margin-bottom:0px;
           margin-right:0px;
           margin-left:0px;background-color:yellow;}
</style>
</head>
<body>
<table>
<thead>
<tr>
<th>Parameters</th><th>Imagette</th><th>Profile</th><th>Remarks</th>
</tr>
</thead>
<tbody>
<tr>
<td>

</td><td class="i"></td>

<td class="i">
<svg width="100%" height="100%" viewBox="0 0 400 400" >
<g>
<rect width="400" height="400" style="stroke-width:1;          stroke:rgb(0,0,0)"></rect>
<circle cx="200" cy="200" r="200" stroke="green" stroke-width="2"></circle>
<circle cx="200" cy="200" r="160" stroke="green" stroke-width="2"></circle>
<circle cx="200" cy="200" r="120" stroke="green" stroke-width="2"></circle>
<circle cx="200" cy="200" r="80" stroke="green" stroke-width="2"></circle>
<circle cx="200" cy="200" r="40" stroke="green" stroke-width="2"></circle>
<path d="M250 150 L150 350 L350 350 Z" style="fill:rgb(0,0,255);stroke-width:1;          stroke:rgb(0,0,0)"></path>
<path d="M200,200 L200,0 A200 200 0 0 1 200 400 Z" style="fill:green;stroke:green;stroke-width:5;          fill-opacity:0.5;stroke-opacity:0.9"></path>
<path d="M150 250 S150 150 170 170 L220 150Z" style="fill:pink;stroke:blue;stroke-width:1;          fill-opacity:0.9;stroke-opacity:0.9"></path>
</g>
</svg>
</td><td></td>
</tr>

</tbody>
</table>
</body>
</html>

SVG 是内联的并且位于表格单元格内部,因此请尝试添加display:block to svg和宽度/高度<td>这样 SVG 就知道根据什么来计算百分比。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何删除 HTML5 中 之间的空格? 的相关文章

随机推荐