【问题标题】:How do I apply inline CSS to an ASP.NET server control?如何将内联 CSS 应用于 ASP.NET 服务器控件?
【发布时间】:2010-09-10 16:23:06
【问题描述】:

根据我运行的一个简单测试,我认为不可能将内联

可以这样做吗?我可以看到它对于只需要应用 1 或 2 个 CSS 类的快速原型很有用。

【问题讨论】:

  • 您能否提供一个代码示例来说明您尝试执行的操作以及您希望它如何在 HTML 中呈现?这将帮助我们解决您的问题。

标签: asp.net css


【解决方案1】:

Intellisense 不会给你提示,但你可以这样做:

<asp:Label ID="Label1" runat="server" Text="Label" style="color:Red;"></asp:Label>

【讨论】:

    【解决方案2】:

    根据www.w3schools.com

    样式元素位于头部。如果您想在页面中包含样式表,您应该在外部定义样式表,并使用&lt;link&gt; 链接到它。

    因此,在控件中包含样式元素(例如 &lt;style type="text\css"&gt;&lt;/style&gt; 块)不是一个好主意。如果可以的话,它可能会在某些浏览器中产生影响,但它不会验证并且是不好的做法。

    如果您想将样式内联应用于元素,那么以下任何一种都可以:

    C#

    myControl.Attributes["style"] = "color:red";
    
    myControl.Attributes.Add("style", "color:red");
    

    VB.NET

    myControl.Attributes("style") = "color:red";
    
    myControl.Attributes.Add("style", "color:red");
    

    但请记住,这将替换样式属性上设置的任何现有样式。如果您尝试在代码中的多个位置设置样式,这可能会成为问题,因此需要注意。

    最好使用 CSS 类,因为您可以将多个样式声明分组并避免冗余和页面膨胀。从WebControl 派生的所有控件都有一个您可以使用的CssClass 属性,但再次注意不要覆盖已在其他地方应用的现有类。

    【讨论】:

      【解决方案3】:

      如果使用 Attributes["style"],则每次调用时都会覆盖样式。如果您在两个不同的代码部分中进行调用,这可能是一个问题。同样,这也可能是一个问题,因为该框架包含用于基本设置的属性,例如边框和颜色,这些属性也将作为内联样式应用。这是一个例子:

      // dangerous: first style will be overwritten
      myControl.Attributes["style"] = "text-align:center";
      // in some other section of code
      myControl.Attributes["style"] = "width:100%";
      

      为了玩得更好,请设置如下样式:

      // correct: both style settings are applied
      myControl.Attributes.CssStyle.Add("text-align", "center");
      // in some other section of code
      myControl.Attributes.CssStyle.Add("width", "100%");
      

      【讨论】:

      • @TylerH - 我的答案中的第一个代码 sn-p 可能有问题,出现在其他答案中。我建议的第二个答案是更可取的方法,但不是。
      • 啊,我现在明白了。感谢您的回复。
      【解决方案4】:

      我认为您必须将其作为属性添加到服务器控件...才能呈现为 HTML。

      所以基本上(在 C# 中),

      ControlName.Attributes["style"] = "color:red";
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2011-11-08
        • 1970-01-01
        • 1970-01-01
        • 2015-09-27
        • 1970-01-01
        • 1970-01-01
        • 2012-07-12
        • 1970-01-01
        相关资源
        最近更新 更多