Question

我有一个像这样的HTML代码：

<tr>
  <td>
    <span>Card No:&nbsp;</span>
    <input id="Text1" type="text" />
    <input id="BtnSave" type="button" value="Save" onclick="return BtnSave_onclick()" />
  </td>
</tr>

这一切都保持着我的一排。我想在我所有的田地之间留出空间..

是html和Web应用程序的新手。

Answer 1

您可以使用边距：

CSS：

span, input {
    margin: 5px;
}

修改

内联：

<tr> <td> <span style="margin:5px">Card No: </span> <input id="Text1" type="text" style="margin:5px" /> <input id="BtnSave" type="button" style="margin:5px" value="Save" onclick="return BtnSave_onclick()" /> </td> </tr>

或者，使用以下代码行创建style.css文件：

span, input { margin: 5px; }

并将其包含在您头部的项目中，如下所示：

<head> <link rel="stylesheet" type="text/css" href="style.css"> </head>

Answer 2

添加margin。

input {
    margin: 0 5px 0 5px; /* top right bottom left */
}

Answer 3

希望这会有所帮助，

<html>
<head>
 <style type="text/css" rel="stylesheet">
   span, input {
    margin: 5px;
   }
 </style>
</head>
<body>
 <tr>
  <td>
    <span>Card No:&nbsp;</span>
    <input id="Text1" type="text" />
    <input id="BtnSave" type="button" value="Save" onclick="return BtnSave_onclick()" />
  </td>
 </tr>
</body>
</html>

如何在表格行中输入文本和按钮之间留出空格

3 个答案: