在 CSHTML 中使用 CSS

在 ASP.NET Core 中，我们可以在 Razor 视图文件中（即 CSHTML 文件）使用 CSS 样式来美化页面。本文将介绍如何在 CSHTML 中使用 CSS。

包含 CSS 文件

首先，我们需要在页面中包含 CSS 文件。通常情况下，我们会将 CSS 文件放在 wwwroot 目录下的 css 子目录中。可以通过以下方式在 CSHTML 文件中引入 CSS 文件：

<link rel="stylesheet" href="/css/style.css">

其中 /css/style.css 是相对于网站根目录的路径，指向我们的 CSS 文件。

注意，这种方法是最基本、最简单的引入 CSS 文件的方式。实际开发中，我们可能使用更先进的方法，例如通过构建工具将 CSS 文件打包成一个文件，或者使用 CSS 预处理器等技术。

内联 CSS

如果要为某个具体的元素添加特定的样式，可以使用内联 CSS。例如，我们想让一个按钮的字体颜色为红色，可以通过以下方式实现：

<button style="color: red;">Click me</button>

这里的 style 属性包含了 CSS 样式内容。

嵌入式 CSS

如果要在页面的头部定义 CSS 样式规则，可以使用嵌入式 CSS。例如，我们想让页面的所有标题字体大小为 24 像素，可以在头部添加以下代码：

<style>
    h1 {
        font-size: 24px;
    }
</style>

这里的 style 标签包含了 CSS 样式代码。它们会在页面加载时被解析和应用。

外部 CSS 文件

另一种定义 CSS 样式规则的方法是使用外部 CSS 文件。例如，我们可以将以下代码保存为 style.css 文件：

h1 {
    font-size: 24px;
}

button {
    background-color: #4CAF50;
    color: white;
    padding: 10px 20px;
}

然后在页面头部引入这个文件：

<link rel="stylesheet" href="/css/style.css">

这样，页面中的所有 h1 元素都会应用 font-size: 24px; 样式，所有按钮元素都会应用 background-color: #4CAF50; color: white; padding: 10px 20px; 样式。

总结

以上就是在 CSHTML 中使用 CSS 的方法。我们可以通过内联 CSS、嵌入式 CSS 或外部 CSS 文件来定义样式规则，从而美化网站页面。当然，这只是 CSS 的基础用法。在实际开发中，我们还要学习更多高级的 CSS 技术。