Asp.net mvc 带MVC的引导图标

通过我们的Razor语法，我可以像这样使用glyphicon：

<div id="addIndirectCityBtn" class="btn btn-success btn-xs">
    <span class="glyphicon glyphicon-plus"></span> Add
</div>

---

我应该在哪里使用glyphicon将其放在textbox中或textbox旁边

您可以在引导中使用input group，form control类会将对象放在100%宽度的box中，因此您需要对它们进行分组

这里有一个例子

<div class="input-group">
    @Html.TextBoxFor(model => model.From.City, new { @id = "cityFrom", @class = "form-control", @placeholder = "City", @style = "margin-bottom: 10px;" }
    <span class="input-group-addon"><i class="glyphicon glyphicon-plus"></i> Add</span>
 </div>

@Html.TextBoxFor（model=>model.From.City，new{@id=“cityFrom”、@class=“form control”、@placeholder=“City”、@style=“margin bottom:10px；”
添加

如何使用Model在Mvc中使用图标

public class Menu
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public string Menuicon { get; set; }
    }

• 例如：

型号

public class Menu
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public string Menuicon { get; set; }
    }

控制器

 [HttpPost]
        public ActionResult Index(Menu m)
        {
            ViewBag.Message = m.Menuicon;
            return View(m);
        }

索引视图

@model projectname.Models.Menu

@using (Html.BeginForm("Index", "Home", FormMethod.Post))
{
    @Html.LabelFor(Model => Model.Name)<br />
        @Html.EditorFor(Model => Model.Name)<br />
        @Html.LabelFor(Model => Model.Menuicon)<br />
        @Html.EditorFor(Model => Model.Menuicon)<br />

        <input type="submit" value="Save">
}
<br />

<div>
    <span class="@ViewBag.Message"></span>
</div>

@model projectname.Models.Menu
@使用（Html.BeginForm（“Index”，“Home”，FormMethod.Post））
{
@Html.LabelFor（Model=>Model.Name）

@Html.EditorFor（Model=>Model.Name）

@Html.LabelFor（Model=>Model.Menuicon）

@Html.EditorFor（Model=>Model.Menuicon）

}

结果

---

您的要求是什么。您想在文本框旁边显示glyphicon吗？下一步或内一步都不重要。大多数解决方案要么将外部div显示为文本框，要么将glyphicon绝对定位在父div中，并对输入应用左或右填充。查看此选项的答案：