Question

我正在向外部页面提交$obj['_id']值，所以我希望没有比创建下面这样的表单更简单的方法，否则我自己就傻了。

在PHP代码中，我改变了这个：

echo '<td><div class="btn-group" role="group" aria-label="...">
     <a class="btn btn-success btn-xs" href="modify.php" role="button">Edit</a>
     <a class="btn btn-danger btn-xs" href="del.php" role="button">Del</a></div></td>';

进入这个：

echo '<td><form name="editform" action="edit.php" method="post">
     <input type="hidden" name="editthisid" value="' . $obj['_id'] . '">    
     <input type="submit" class="btn btn-success btn-xs" name="edit" value="Edit">
     </form>
     <form name="deleteform" action="del.php" method="post">
     <input type="hidden" name="deletethisid" value="' . $obj['_id'] . '">    
     <input type="submit" class="btn btn-danger btn-xs" name="" value="Del">       
     </form></td>';

使用第一个代码，按钮水平显示，第二个，提交按钮垂直显示。网页的宽度无关紧要，而我试图调整表格布局并且无法将按钮水平放置。

我正在寻找一个类来收集像btn-group这样的组中的表单，以便它们水平显示以节省网页布局上的空间。

是否有类似btn-group的类别分组表格？或者这无济于事？如果是这样，还有其他选择可以轻松地将它们放在一起吗？

编辑：我还没有创建任何CSS布局。

Answer 1

默认情况下，锚标记是内联元素。因此，如果没有样式，多个<a>标记将水平呈现。但是，表单标记默认为阻止级别元素。所以你的多个<form>标签垂直堆叠。

我会避免使用<table>和关联的<tr>或<td>标记进行布局，除非您实际渲染数据表。

你几乎肯定想在这里使用CSS来控制你的布局。尝试在<form>标记中添加一个类，将其显示为内联块元素，例如：

<style type="text/css">
    .inline {
        display: inline-block;
    }
</style>

<form class="inline">
    <input type="submit" class="btn btn-success btn-xs" name="edit" value="Edit">
</form>

<form class="inline">
    <input type="submit" class="btn btn-danger btn-xs" name="" value="Del">       
</form>

<强>更新

啊，如果您实际渲染表格，那么您应该能够在同一行的表格单元格中渲染表单。默认情况下，这将水平呈现按钮：

<table>
  <tr>
    <td><form><input type="submit" value="Edit"></form></td>
    <td><form><input type="submit" value="Del"></form></td>
  </tr>
</table>

我怀疑，如果您在上面的第二个示例中没有看到提交按钮水平呈现，那是因为您没有正确地将<td>元素嵌套在同一个元素中<tr>和父<table>标记。

HTML按钮组更改为表单，水平变为垂直

1 个答案: