Question

我有两个btn缺省显示为btn-default的按钮，但是第二个按钮（ActionLink按钮）的悬停效果没有第一个按钮的相同属性。第一个看起来好像有一些针对输入标签的Css，因此我想将输入标签提供给第二个按钮。但是，我似乎无法毫无错误地正确集成它。谁能指出我将输入代码与ActionLink按钮组合在一起的方向？

这是我的两个按钮的代码，“创建”按钮在顶部，这是带有输入标签的代码，我也希望将其赋予底部的“返回列表”按钮。我现在还没有包括Css，因为我的问题更多与html有关。但是，如果有必要，请告诉我。

 <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Create" class="btn btn-default" />
            </div>
            </div>

        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">              
                @Html.ActionLink("Back to List", "Index", routeValues: null, htmlAttributes: new {@class = "btn btn-default", @role = "button" })

            </div>
        </div>

我感谢所有答案！

Answer 1

这对我有用。看起来不是很干净。

    <div class="input-group">
         <div class="input-group-addon">
               @Html.ActionLink("Back to List", "Index", routeValues: null, htmlAttributes: new {@class = "btn btn-default", @role = "button" })
         </div>
         <input class="text-box single-line form-control" style="width:100%;">
    </div>

Answer 2

btn-default中不再有bootstrap4。请改用btn-secondary。那应该给您一致想要的悬停效果。
请注意，您不必为提交按钮使用<input />。您可以只使用常规<button />和正确的类型：
```
<button type="submit" class="btn btn-secondary">Create</button>
```
因此您不必坚持认为必须为另一个按钮使用输入标签。
@Html.ActionLink()将生成锚标记<a href="# />，除非您对其进行覆盖，否则无论如何都不能使用它来生成输入标记。

如何将输入标签与ActionLink按钮正确结合？

2 个答案: