Compartir por


WebControl.CssClass Propiedad

Definición

Obtiene o establece la clase Hoja de estilos en cascada (CSS) representada por el control de servidor web en el cliente.

public:
 virtual property System::String ^ CssClass { System::String ^ get(); void set(System::String ^ value); };
[System.ComponentModel.Bindable(true)]
public virtual string CssClass { get; set; }
public virtual string CssClass { get; set; }
[<System.ComponentModel.Bindable(true)>]
member this.CssClass : string with get, set
member this.CssClass : string with get, set
Public Overridable Property CssClass As String

Valor de propiedad

Clase CSS representada por el control de servidor web en el cliente. El valor predeterminado es Empty.

Atributos

Ejemplos

En el ejemplo siguiente se muestra cómo usar la CssClass propiedad para cambiar el estilo de un HyperLink control.

Nota:

En el ejemplo de código siguiente se usa el modelo de código de un solo archivo y es posible que no funcione correctamente si se copia directamente en un archivo de código subyacente. Este ejemplo de código debe copiarse en un archivo de texto vacío que tenga una extensión .aspx. Para obtener más información sobre el modelo de código de Formularios Web Forms, consulte ASP.NET modelo de código de página de formularios web Forms.

<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">
    void Button1_Click(object sender, EventArgs e)
    {
        if (HyperLink1.CssClass == "CssStyle1")
            HyperLink1.CssClass = "CssStyle2";
        else
            HyperLink1.CssClass = "CssStyle1";
    }
</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head2" runat="server">
    <title>CssClass Property Example</title>
    <style type="text/css">
        .CssStyle1   
        { 
           font: 10pt Verdana; 
           font-weight:700;
           color: Green;
        }

        .CssStyle2
        { 
           font: 15pt Times; 
           font-weight:250;
           color: Blue;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <h3>CssClass Property of a Web Control</h3>
        <asp:HyperLink id="HyperLink1" 
            NavigateUrl="http://www.microsoft.com" 
            CssClass="CssClass1" 
            Text="Click here to go to the Microsoft site" 
            Target="_new" runat="server" />
        <p><asp:Button id="Button1" 
            Text="Click to change the CSS style of the link"
            OnClick="Button1_Click" runat="server" />
         </p>
    </div>
    </form>
</body>
</html>
<%@ Page Language="VB" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">
    Sub Button1_Click(ByVal sender As Object, ByVal e As EventArgs)
        If HyperLink1.CssClass = "CssStyle1" Then
            HyperLink1.CssClass = "CssStyle2"
        Else
            HyperLink1.CssClass = "CssStyle1"
        End If
    End Sub
</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head2" runat="server">
    <title>CssClass Property Example</title>
    <style type="text/css">
        .CssStyle1   
        { 
           font: 10pt Verdana; 
           font-weight:700;
           color: Green;
        }

        .CssStyle2
        { 
           font: 15pt Times; 
           font-weight:250;
           color: Blue;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <h3>CssClass Property of a Web Control</h3>
        <asp:HyperLink id="HyperLink1" 
            NavigateUrl="http://www.microsoft.com" 
            CssClass="CssClass1" 
            Text="Click here to go to the Microsoft site" 
            Target="_new" runat="server" />
        <p><asp:Button id="Button1" 
            Text="Click to change the CSS style of the link"
            OnClick="Button1_Click" runat="server" />
         </p>
    </div>
    </form>
</body>
</html>

<html>
<head>

  <style>

      .CssStyle1   
      { 
          font: 12pt verdana; 
          font-weight:700;
          color:orange;
      }

      .CssStyle2
      { 
          font: 15pt times; 
          font-weight:250;
          color:blue;
      }

  </style>

  <script language="C#" runat="server">

      void Button1_Click(Object sender, EventArgs e) {
    HyperLink1.CssClass=((HyperLink1.CssClass=="CssStyle1")?"CssStyle2":"CssStyle1");
      }

  </script>

</head>
<body>

  <h3><font face="Verdana">CssClass Property of a Web Control</font></h3>

<form runat="server">

  <asp:HyperLink id="HyperLink1" NavigateUrl="http://www.microsoft.com" 
    CssClass="spanstyle" Text="Click here to go to the Microsoft site" 
    Target="_new" runat="server"/>

  <p>

  <asp:Button id="Button1" Text="Click to change the Css style of the above link"
    OnClick="Button1_Click" runat="server"/>

</form>

</body>
</html>

Comentarios

Use la CssClass propiedad para especificar la clase CSS que se va a representar en el cliente para el control servidor web. Esta propiedad se representará en exploradores para todos los controles. Siempre se representará como el atributo de clase, independientemente del explorador.

Importante

Este ejemplo tiene un cuadro de texto que acepta la entrada del usuario, que es una amenaza de seguridad potencial. De forma predeterminada, ASP.NET páginas web validan que la entrada del usuario no incluye elementos HTML ni de script. Para obtener más información, consulte Información general sobre vulnerabilidades de seguridad de script.

Por ejemplo, supongamos que tiene la siguiente declaración de control de servidor web:

<asp:TextBox id="TextBox1" ForeColor="Red" CssClass="class1" />

El código HTML siguiente se representa en el cliente para la declaración de control de servidor web anterior:

<input type=text class="class1" style="ForeColor:red">

Si usa hojas de estilos en cascada (CSS) para personalizar la apariencia de un control, use estilos insertados o un archivo CSS independiente, pero no ambos. El uso de estilos insertados y un archivo CSS independiente podría provocar resultados inesperados.

Nota:

En los exploradores que no admiten CSS, establecer la CssClass propiedad no tendrá ningún efecto.

Se aplica a

Consulte también