如何仅使用HTML或少量CSS将这些复选框格式化为等间距我很难在复选框之间添加间距，即使我把它们放在另一行，它们似乎并不配合。
<fieldset>
<legend><h2><b><u>General Information</u></b></h2></legend>
<table cellpadding="8">
<th>I would like more information abput the followng users:-</th>
<tr>
<td><input type="checkbox" name="user">Backpack Cal</td>
<td><input type="checkbox" name="user">California Hotspring</td>
<td><input type="checkbox" name="user">California Cabin</td>
</tr>
<tr>
<td><input type="checkbox" name="user">Cycle California</td>
<td><input type="checkbox" name="user">Kids California</td>
<td><input type="checkbox" name="user">From Desert To Sea</td>
</tr>
<tr>
<td><input type="checkbox" name="user">Nature Watch</td>
<td><input type="checkbox" name="user">Taste Of California</td>
<td><input type="checkbox" name="user">Snow Board Cali</td>
</tr>
</table>
</fieldset>
使用第个元素的colspan属性来跨越整个列
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<fieldset>
<legend><h2><b><u>General Information</u></b></h2></legend>
<table cellpadding="8">
<th colspan="3">I would like more information about the followng users:-</th>
<tr>
<td><input type="checkbox" name="user">Backpack Cal</td>
<td><input type="checkbox" name="user">California Hotspring</td>
<td><input type="checkbox" name="user">California Cabin</td>
</tr>
<tr>
<td><input type="checkbox" name="user">Cycle California</td>
<td><input type="checkbox" name="user">Kids California</td>
<td><input type="checkbox" name="user">From Desert To Sea</td>
</tr>
<tr>
<td><input type="checkbox" name="user">Nature Watch</td>
<td><input type="checkbox" name="user">Taste Of California</td>
<td><input type="checkbox" name="user">Snow Board Cali</td>
</tr>
</table>
</fieldset>
</body>
</html>这将为输入元素提供几乎相等的间距
试试吧…它可能会起作用
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>checkbox</title>
<style>
.check
{
display: flex;
flex-direction: row;
justify-content: left;
flex-wrap: wrap;
}
div.check div
{
width:160px;
margin:10px;
}
</style>
</head>
<body>
<fieldset>
<legend><h2><b><u>General Information</u></b></h2></legend>
<h3>I would like more information about the followng users:-</h3>
<div class="check">
<div><input type="checkbox" name="user">Backpack Cal</div>
<div><input type="checkbox" name="user">California Hotspring</div>
<div><input type="checkbox" name="user">California Cabin</div>
<div><input type="checkbox" name="user">Cycle California</div>
<div><input type="checkbox" name="user">Kids California</div>
<div><input type="checkbox" name="user">From Desert To Sea</div>
<div><input type="checkbox" name="user">Nature Watch</div>
<div><input type="checkbox" name="user">Taste Of California</div>
<div><input type="checkbox" name="user">Snow Board Cali</div>
</div>
</fieldset>
</body>
</html>