样式 @Html.DisplayFor 在 Razor 视图中带有颜色的文本

Question

我正在尝试更改@Html.DisplayFor调用的输出颜色。 这是简单的文字。 我创建了 css 类并尝试直接在 Razor 视图中设置样式，但没有任何效果。 模型没有问题（它呈现正确的文本）。 有许多类似的问题（ 一、 二、 三），但这些解决方案都没有对我有用。 最初的尝试是在<h3>标签内，但我也在它之外尝试过。 这是我在视图中的尝试（我尝试了一些东西......）：

<h3>@Html.DisplayFor(model => model.Title, new { @class = "h3.link-colour;" })</h3>
@Html.DisplayFor(model => model.Title, new { @class = "h3.link-colour" })
@Html.DisplayFor(model => model.Title, new { @class = "link-colour"})
@Html.DisplayFor(model => model.Title, new { @class = "link-colour" })
@Html.DisplayFor(model => model.Title, new { @style = "color:#00BFFF" })
@Html.DisplayFor(model => model.Title, new { @style = "color:#00BFFF !important;" })

site.css 的相关部分在这里：

/* colour links */
a.link-colour {
    color: #00BFFF !important;
}

h3.link-colour {
    color: #00BFFF !important;
}

.link-colour {
    color: #00BFFF !important;
}

css 适用于视图的其他方面。 在 Views/Shared/_Layout.cshtml 文件中，有<link rel="stylesheet" href="~/css/site.css" /> 。 我已经能够在这个项目的另一个视图中对@Html.ActionLink的调用中应用new { @class = "link-colour" }的技术，所以我不确定发生了什么。 我也清除了浏览器缓存。 感谢您的任何想法。

Answer 1

@Html.DisplayFor将不起作用，因为它不呈现任何 html 标签，而是呈现纯文本。 您可以在浏览器中按 F12 并检查，您会注意到没有标签，只有原始内容。

用

@Html.LabelFor(model => model.Whatever, htmlAttributes: new { @class = "your css" })

Answer 2

我们可以使用它周围的 div 并为 div 添加类，

<div class="style">
@Html.DisplayNameFor(model => model.title)
</div>

并为 .style 类编写样式，我不知道这是否是正确的方法，但它对我有用。

Answer 3

我有两种方法可以做到这一点：

1：给<label></label>一个类和样式：

@Html.LabelFor(model => model.Title, new { @class = "myCssClass" })

2：使用您必须呈现内容的代码，但将其包装在 div 中并定位其内容：

<div class="myClass">
    <h3>@Html.DisplayFor(model => model.Title)</h3>
    @Html.DisplayFor(model => model.Title)
    @Html.DisplayFor(model => model.Title)
    @Html.DisplayFor(model => model.Title)
    @Html.DisplayFor(model => model.Title)
    @Html.DisplayFor(model => model.Title)
</div>

CSS：

div.myClass {
    color: #00BFFF;
}
div.myClass h3{
    color: Gold;
}

Answer 4

这是一个旧线程，但这对我有用。 希望这可以帮助现在搜索的人：@Html.LabelForModel(model.Whatever, new { @style = "color: red" })

Answer 5

出于某种原因， <div>标签只是搞砸了我的页面格式，然后我尝试在 cshtml 页面上插入<span>并且它起作用了。

示例代码： “Total Hits”将显示为黑色， <span>标记之间的任何值都将显示为红色

<h2>Total Hits : <span style="color:Maroon;"> @Html.DisplayFor(m => m.UserAccessCount)</span> </h2>

Answer 6

尝试这个

@Html.Label("GP", item.GP, new {  @style = "color:Red;" })