ASP.NET Core Razor 页面 _Layout.cshtml.css 未应用

Question

我偶然发现了 CSS 文件的问题

_Layout.cshtml.css

。好吧，简短而快速的描述，CSS 类“页脚”未被应用。其他 CSS 类（如“border-top”和“text-center”）也可以正常工作。但是

footer

类只是没有应用或被破坏。另外，我尝试使用

@RenderSection("footer", required: false)

但那也没有任何作用。出于测试目的，我将 CSS 类重命名为

my-test

之类的内容，并仅设置

text-align: center;

但文本未居中。

过去两天，我在谷歌上搜索了如何使页脚粘在底部，因为它总是在顶部。无论我尝试什么，CSS 类

footer

都从未被应用。此外，对

_Layout.cshtml.css

的其他更改也不会反映出来。我可以通过在

_Layout.cshtml

文件中混合类和样式标签，在网站底部制作一个带有居中文本的粘性页脚。但这让我很烦恼。为什么我不能使用

_Layout.cshtml.css

文件和 CSS 类

footer

来调整布局？ 我在这里想念什么？

结果应如下所示： 但不需要混合 .css 和 HTML 样式标签。

我尝试了以下编辑：

添加@RenderSection（“页脚”，必需：false）

在页脚中定义“footer”类：

在 div 元素中定义“footer”类：

定义用于使文本居中的 CSS 类：

添加了

@await RenderSection("footer", required: false)

并使用 'my-test' 作为 CSS 类以使文本在 div 元素上居中：

Answer 1

你想要像下面这样的东西吗？

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    white-space: nowrap;
    line-height: 60px;
    text-align: center;
}

html:

 <footer class="border-top footer text-muted">
        <div class="container">
            &copy; 2023 - areacore - <a asp-area="" asp-controller="Home" asp-action="Privacy">Privacy</a>
        </div>
    </footer>

结果：

Answer 2

1. 在

   _Layout.cshtml

   中确保您的链接标签在href中具有正确的名称（我在重命名我的项目名称后自己遇到了这个问题。用您的项目名称重命名YourProjectNameHere！）：

   <link rel="stylesheet" href="~/YourProjectNameHere.styles.css" asp-append-version="true" />
   

2. 如果仍未应用，请在第一步后尝试清理并重建解决方案，然后再次检查。通过这一步，编译器生成的样式和 html 标签字符串（您可以在检查器中看到）可能会是相同的。