Html asp.net mvc 将 css 添加到 editorfor?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3418790/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 04:00:45  来源:igfitidea点击:

asp.net mvc adding css to editorfor?

htmlasp.net-mvc

提问by hhay

I'd like to change style of the 'editor for' textbox from MVC, specifically I want to make the textbox larger.

我想从 MVC 更改“编辑器”文本框的样式,特别是我想让文本框变大。

I've tried adding css a few ways, to no avail.

我试过通过几种方式添加css,但无济于事。

including :

包含 :

<td class="myCss"><%=Html.EditorFor(x => x.NickName)%></td>

and

<td class="myCss"><%=Html.EditorFor(x => x.NickName, new { @class = "myCss" })%></td>

help pls!

请帮助!

回答by jim tollan

robh,

罗布,

it's difficult to know from your question whether you're looking for a 'generic' or specific solution within your project. as such, i'm going to address the generic - works once, works everywhere solution.

从您的问题中很难知道您是在寻找项目中的“通用”解决方案还是特定解决方案。因此,我将解决通用问题 - 一次有效,处处有效的解决方案。

this entails taking a few steps (convention over configuration). basically here's what's required:

这需要采取一些步骤(约定优于配置)。基本上这里是什么要求:

  • create new folder under 'views->shared called Editor Templates'
  • create a new usercotrol (ascx) files under that called 'string.ascx'
  • 在“views->shared called Editor Templates”下创建新文件夹
  • 在名为“string.ascx”的下创建一个新的 usercotrol (ascx) 文件

now, define that ascx file as per:

现在,按照以下方式定义该 ascx 文件:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<string>" %>
<div class="editor-label">
    <%= Html.LabelFor(model => model) %>
</div>
<div class="new-editor-field">
    <%= Html.TextBoxFor(model => model) %>
    <%= Html.ValidationMessageFor(model => model) %>
</div>

this will now make all 'string' based EditorFor() calls use this 'template'. simply make the class 'new-editor-field' reflect your desired css style for that field. obviously, cook as per your own requirement (i.e. you may not want the LabelFor tat etc..)

这将使所有基于“字符串”的 EditorFor() 调用都使用此“模板”。只需让类 'new-editor-field' 反映您对该字段所需的 css 样式。显然,根据您自己的要求烹饪(即您可能不想要 LabelFor tat 等。)

hope this helps - tho i have to say, this is just one of a few ways to do this (but is my prefered way).

希望这会有所帮助 - 我不得不说,这只是执行此操作的几种方法之一(但这是我的首选方式)。

enjoy

请享用

jim

吉姆

回答by davewasthere

Rather than requiring your input field to have the class directly applied, you could use the following:

您可以使用以下内容,而不是要求您的输入字段直接应用该类:

<div class="editor-field myCss">
    @Html.EditorFor(model => model.Nickname)
</div>

Which results in roughly the following HTML

结果大致如下 HTML

<div class="editor-field myCss">
    <input class="text-box single-line" data-val="true" id="Nickname" name="Nickname" type="text" value="">
</div>

Then just use the CSS rule to style appropriately

然后只需使用 CSS 规则适当地设置样式

.myCss input.text-box {font-size: 2em;}

.myCss input.text-box {font-size: 2em;}

回答by Chase Florell

Try this

尝试这个

<%= Html.TextBoxFor(x => x.NickName, new { @class = "myCss" })%>

or

或者

<%= Html.TextAreaFor(x => x.NickName, new { cols = "40%", @class = "myCss" })%>

Now you can define your attributes because MVC knows what type to use (TextArea).

现在您可以定义您的属性,因为 MVC 知道要使用什么类型 (TextArea)。

回答by Sebastian

Place result of EditorFor inside a div with some class attribute on it, and inside style definition for this class, use !important directive to force accept desired values to anything inside that div.

将 EditorFor 的结果放在具有某些类属性的 div 中,并在此类的样式定义中,使用 !important 指令强制接受该 div 中任何内容的所需值。

回答by K.Kirivarnan

Try this,

尝试这个,

https://stackoverflow.com/a/4249988/505474

https://stackoverflow.com/a/4249988/505474

Copied from above link,

从上面的链接复制,

@model DateTime?

@Html.TextBox("", (Model.HasValue ? Model.Value.ToShortDateString() : string.Empty), new { @class = "datePicker" })

It works for me...

这个对我有用...