Страница макета входа ASP.NET MVC не отображает CSS

Я создал новый макет входа в систему для своей страницы входа и не могу получить ссылку на файл css.

Я пытался вообще не использовать страницу макета, используя @{Макет = ноль} и отображая всю HTML-страницу (теги заголовков... и т. д.) и связывая CSS в тегах заголовков и ничего. Я также переместил ссылку login.css над ссылкой начальной загрузки, и она по-прежнему не отображает CSS. Теперь у меня есть LoginLayout с файлами CSS и начальной загрузки, связанными в тегах заголовков. Еще ничего.

Мой бутстрап рендерится, но не мой CSS. Кто-нибудь может помочь с привязкой файла логин.css к _LoginLayout.cshtml?

_LoginLayout.cshtml:

<!DOCTYPE html>

<html>
<head>
    <meta name = "viewport" content = "width=device-width" />
    <title>@ViewBag.Title | Knowledgebase</title>
    <link href = "@Url.Content("~/Content/bootstrap.css")" rel = "stylesheet" type = "text/css" />
    <link href = "@Url.Content("~/Content/login.css")" rel = "stylesheet" type = "text/css" />
</head>
<body>
    <div>
         @RenderBody()
    </div>
</body>
</html>

Логин.cshtml Представление:

@model ITKnowledgebase.Models.LoginModel

@{
    ViewBag.Title = "Login";
    Layout = "~/Views/Shared/_LoginLayout.cshtml";
}


@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()

    <div class = "container">
        <div class = "form-horizontal">
            <br>
            <img src = "~/Content/Images/logo.png">
            <br> <br>
            <h2>Knowledgebase Sign In</h2>

            @Html.ValidationSummary(true, "", new { @class = "text-danger" })

            <div class = "pnlMain">
                <label class = "sr-only">ID</label>
                @Html.EditorFor(model => model.Id, new { htmlAttributes = new { placeholder = "ID", @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Id, "", new { @class = "text-danger" })
                <label class = "sr-only">Username</label>
                @Html.EditorFor(model => model.Username, new { htmlAttributes = new { placeholder = "Username", @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Username, "", new { @class = "text-danger" })
                <label class = "sr-only">Password</label>
                @Html.EditorFor(model => model.Password, new { htmlAttributes = new { placeholder = "Password", @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Password, "", new { @class = "text-danger" })
            </div>
            <input type = "submit" value = "Sign In" class = "btn btn-primary" id = "btnSubmit" />
        </div>
    </div>
}
    <div>
        @Html.ActionLink("Back to List", "Index")
    </div>


    <script src = "@Url.Content("~/Scripts/jquery.validate.min.js")" type = "text/javascript"></script>
    <script src = "@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type = "text/javascript"></script>

    <hr />
    <footer>
        <p>&copy; | All rights reserved.</p>
    </footer>

    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/bootstrap")

Контроллер аккаунта:

namespace ITKnowledgebase.Controllers
{
    public class AccountController : Controller
    {
        // GET: Account
        public ActionResult Login()
        {
            var login = new LoginModel();
            return View(login);
        }

        [HttpPost]
        public ActionResult Login(LoginModel login)
        {
            if (ModelState.IsValid)
            {
                return RedirectToAction("Index", "Home", login);
            }
            return View(login);
        }
    }
}

Я ожидаю, что фон станет синим, так как мой файл логин.css включает в себя:

body {
    font-size: 27px;
    background-color: lightblue;
}

c# css asp.net-mvc model-view-controller

28.05.2019 02:05

Стоит ли изучать PHP в 2023-2024 годах?

Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Приемы CSS-макетирования - floats и Flexbox

Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...

Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest

В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Пользовательский скаляр GraphQL

Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип...

1 195

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

1. Попробуйте указать источник следующим образом:

Вместо этого

 <link href = "@Url.Content("~/Content/bootstrap.css")" rel = "stylesheet" type = "text/css" />

Использовать этот

 <link href = "~/Content/bootstrap.css" rel = "stylesheet" type = "text/css" />

Если вы используете визуальную студию, лучше перетащите файл css, чтобы убедиться, что источник правильный.

Попробуйте обновить свой сайт, если это не так. (обновить с помощью CTRL + F5)
Вставьте !important после вашего атрибута, чтобы перезаписать тот же атрибут в другом файле css. Так
тело { размер шрифта: 27px !важно; background-color: светло-голубой!важно; }

Ничего себе, CTRL + F5 сделали свое дело. Я предполагаю, что он держал кеш моих предыдущих попыток. Спасибо. Я совершенно забыл, как важно делать полное обновление при внесении изменений. Кроме того, +1 за совет по перетаскиванию файлов CSS. Я не знал, что ты можешь это сделать.

— 28.05.2019 02:32

28.05.2019 02:20