我有以下代码。我想删除水平和垂直按钮之间的空间。怎么做？
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="styles.css" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>The Main Page</title>
</head>
<body>
<table>
<tr>
<td><button></button></td>
<td><button></button></td>
<td><button></button></td>
<td><button></button></td>
<td><button></button></td>
<td><button></button></td>
<td><button></button></td>
<td><button></button></td>
</tr>
<tr>
<td><button></button></td>
<td><button></button></td>
<td><button></button></td>
<td><button></button></td>
<td><button></button></td>
<td><button></button></td>
<td><button></button></td>
<td><button></button></td>
</tr>
</table>
</body>
CSS代码是
root
{
display: block;
}
button
{
background-image:url('darkSquare.jpg');
width:50px;
height:50px;
}
最佳答案
这很可能是由表格本身应用的。默认情况下，表格的单元格之间会有 ~3px 的间距，每个单元格都有一个填充(除非你删除了它们)。尝试这样的事情:
table { border-collapse: collapse; border-spacing: 0 }
td { padding: 0 }
默认情况下，按钮周围还有一个边框，顶部和左侧为白色，底部和右侧为灰色，以创建插入效果。它们可以很容易地被删除:
button { border: 0 }
关于html - 如何删除表格行或 "column"中两个按钮之间的空格？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9400896/