如何添加 CSS 类到 html 通用控件 div?

我创建了这样一个 div 标签:

System.Web.UI.HtmlControls.HtmlGenericControl dynDiv =
new System.Web.UI.HtmlControls.HtmlGenericControl("DIV");

我在 div 标签中添加了如下样式:

dynDiv.Style.Add(HtmlTextWriterStyle.BorderStyle, "1px solid #DBE0E4");
dynDiv.Style.Add(HtmlTextWriterStyle.Height, "auto");
dynDiv.Style.Add(HtmlTextWriterStyle.MarginTop, "5px");
dynDiv.Style.Add(HtmlTextWriterStyle.PaddingBottom, "5px");
dynDiv.Style.Add(HtmlTextWriterStyle.Width, "682px");

但是我需要通过位于文件夹 ~/css/maincss.css中的一个外部 css 文件来控制 div 标记的样式。

如何将该文件中的 css 应用到这个 div?

109469 次浏览

你不需要将 css 文件添加到 div 中,而是添加一个类,然后将导入放在 HTML 页面的顶部,如下所示:

<link href="../files/external.css" rel="stylesheet" type="text/css" />

然后在代码中添加如下类: ‘ myStyle’。

然后在 css 文件中执行以下操作:

.myStyle
{
border-style: 1px solid #DBE0E4;
}
dynDiv.Attributes["class"] = "myCssClass";

要向通过 HtmlGenericControl生成的 div 添加类,可以使用:

div1.Attributes.Add("class", "classname");

如果你使用 Panel选项,应该是:

panel1.CssClass = "classname";

如果要将类添加到元素的现有类列表中:

element.Attributes.Add("class", element.Attributes["class"] + " " + sType);

如果你打算重复这一点,不妨使用一个扩展方法:

// appends a string class to the html controls class attribute
public static void AddClass(this HtmlControl control, string newClass)
{
if (control.Attributes["class"].IsNotNullAndNotEmpty())
{
control.Attributes["class"] += " " + newClass;
}
else
{
control.Attributes["class"] = newClass;
}
}

我的方法是:

/// <summary>
/// Appends CSS Class seprated by a space character
/// </summary>
/// <param name="control">Target control</param>
/// <param name="cssClass">CSS class name to append</param>
public static void AppendCss(HtmlGenericControl control, string cssClass)
{
// Ensure CSS class is definied
if (string.IsNullOrEmpty(cssClass)) return;


// Append CSS class
if (string.IsNullOrEmpty(control.Attributes["class"]))
{
// Set our CSS Class as only one
control.Attributes["class"] = cssClass;
}
else
{
// Append new CSS class with space as seprator
control.Attributes["class"] += (" " + cssClass);
}
}

然而,我认为 Curt 的回答是正确的,如果您想向一个 div 添加一个类,而这个 div 已经在 ASP.NET 代码中声明了一个类,那么该怎么办呢。

下面是我的解决方案,它是一个泛型方法,因此您可以直接调用它,如下所示:

Asp Net Div 声明:

<div id="divButtonWrapper" runat="server" class="text-center smallbutton fixPad">

添加类的代码:

divButtonWrapper.AddClassToHtmlControl("nameOfYourCssClass")

类别:

public static class HtmlGenericControlExtensions
{
public static void AddClassToHtmlControl(this HtmlGenericControl htmlGenericControl, string className)
{
if (string.IsNullOrWhiteSpace(className))
return;


htmlGenericControl
.Attributes.Add("class", string.Join(" ", htmlGenericControl
.Attributes["class"]
.Split(' ')
.Except(new[] { "", className })
.Concat(new[] { className })
.ToArray()));
}
}

扩展方法怎么样?

这里我有一个 show 或 hide 方法。使用我的 CSS 类 藏起来了

public static class HtmlControlExtensions
{
public static void Hide(this HtmlControl ctrl)
{
if (!string.IsNullOrEmpty(ctrl.Attributes["class"]))
{
if (!ctrl.Attributes["class"].Contains("hidden"))
ctrl.Attributes.Add("class", ctrl.Attributes["class"] + " hidden");
}
else
{
ctrl.Attributes.Add("class", "hidden");
}
}


public static void Show(this HtmlControl ctrl)
{
if (!string.IsNullOrEmpty(ctrl.Attributes["class"]))
if (ctrl.Attributes["class"].Contains("hidden"))
ctrl.Attributes.Add("class", ctrl.Attributes["class"].Replace("hidden", ""));
}
}

然后,当您想显示或隐藏您的控件时:

myUserControl.Hide();


//... some other code


myUserControl.Show();

如果要将类添加到元素的类的现有列表中,可以使用其他方法:

element.Attributes["class"] += " myCssClass";