首页 > 解决方案 > 如果每个按钮的形式不同,如何使两个按钮内联?

问题描述

如何使两种不同形式的提交按钮内联?第一种形式必须是块级元素,但第二种形式可以是内联块。

<form action="#">
     <div class="form-group">
        <label for="title">Title</label>
        <input type="text" name="title" class="form-control" id="title" placeholder="Enter title">
    </div>

    <div class="form-group">
        <label for="body">Body</label>
        <textarea class="form-control" name="body" id="body" rows="10"></textarea>
    </div>

    <button type="submit" class="btn btn-primary">Update</button>

</form>

<form action="#">
    <button type="submit" class="btn btn-danger">DELETE</button>
</form>

标签: htmlcssbootstrap-4

解决方案


只需将delete按钮移动到另一个表单标签中。这应该有效。

<form action="#">
     <div class="form-group">
        <label for="title">Title</label>
        <input type="text" name="title" class="form-control" id="title" placeholder="Enter title">
    </div>

    <div class="form-group">
        <label for="body">Body</label>
        <textarea class="form-control" name="body" id="body" rows="10"></textarea>
    </div>

    <button type="submit" class="btn btn-primary">Update</button>

    <form action="#">
    <button type="submit" class="btn btn-danger">DELETE</button>
    </form>

</form>

推荐阅读