CSS 文件无法与 ASP.NET MVC5 一起正常工作答案

【问题标题】：CSS file not working properly with ASP.NET MVC5CSS 文件无法与 ASP.NET MVC5 一起正常工作
【发布时间】：2023-01-23 22:01:27
【问题描述】：

在我的 ASP.NET MVC 项目中，我最近遇到了 CSS 文件的问题（我使用的是 Bootstrap 文件），我尝试修复 Visual Studio 22，但那没有用，之后我尝试了（CTRL + F5/热重载), 这部分适用于 CSS 文件，现在的问题是我放置的表格没有按顺序正确显示，而是并排显示。如下所示

what the output looks like

传输.cshtml 文件

@model BankSystem.Models.transfer

@{
    ViewBag.Title = "Transfer";
    Layout = "~/Views/Shared/_bankLayout.cshtml";
}

@if (ViewBag.text != null)
{
    <div style="color: #008000">@ViewBag.text</div>
}

<h2>Transfer</h2>

@using (Html.BeginForm("Transfer", "Home", FormMethod.Post))
{
    <div class="container">
        <div class="row form-horizontal">
            <div class="form-group">
                <div class="col-md-1">@Html.Label("Account Number")</div>
                <div class="col-md-3">@Html.TextBoxFor(x => x.AccountNumber, new { @class = "form-control" })</div>
            </div>
            <div class="form-group">
                <div class="col-md-1">@Html.Label("CUSIP")</div>
                <div class="col-md-3">@Html.TextBoxFor(x => x.CUSIP, new { @class = "form-control" })</div>
            </div>
            <div class="form-group">
                <div class="col-md-1">@Html.Label("Account Holder")</div>
                <div class="col-md-3">@Html.TextBoxFor(x => x.AccountHolder, new { @class = "form-control" })</div>
            </div>
            <div class="form-group">
                <div class="col-md-1">@Html.Label("Amount")</div>
                <div class="col-md-3">@Html.TextBoxFor(x => x.Amount, new { @class = "form-control" })</div>
            </div>
            <div class="form-group">
                <div class="col-md-1"><input type="submit" value="Send" class="btn btn-primary" /></div>
                <div class="col-md-3"><a href="@Url.Action("Transfer", "Home")" class="btn btn-default">Cancel</a></div>
            </div>
        </div>
    </div>
}

我放置的表格应在左侧向下对齐，但它们并排放置，无需更改样式表中的任何内容，我们将不胜感激。

【问题讨论】：

标签： html css asp.net asp.net-mvc web

【解决方案1】：

<div class="row form-horizontal"> 似乎是这里确凿的证据，因为它包围了所有的表单组。

我会摆脱那个 div，并使用 <div class="form-group row"> 代替 <div class="form-group">。这应该确保您的所有表单组都显示在单独的行中。

希望这可以帮助：）

【讨论】：