Change CSS Example
![css]()
Above image default CLASS attached is LabelBlue On Button Change CSS Class click event changed CLASS is LabelGrey.
Command: Check code for detail,
lblMessage.CssClass = "LabelGrey";
Result After Clicked Button
![css]()
Change Style Example
![style]()
Above image by default there is no CLASS and STYLE attached with text On Button Change Style On Click on click event changed.
Command: Check code for detail,
lblWithoutStyle.Style.Add("font-size", "50px");
Result After Clicked Button
![style]()
Attached CSS Example
![default]()
Above image default no CLASS is attached On Button Class Attached on Click click event attached CLASS ClassJoined.
Command: Check code for detail,
lblWithoutClass.Attributes.Add("class", "ClassJoined");
Result After Clicked Button
![default]()
ASPX Page Code:
- <%@ Page Language="C#" AutoEventWireup="true" CodeFile="ChangeCSSClass.aspx.cs" Inherits="ChangeCSSClass" %>
-
- <!DOCTYPE html>
-
- <html xmlns="http://www.w3.org/1999/xhtml">
-
- <head runat="server">
- <style>
- .LabelGrey
- {
- font-weight: bold;
- color: darkgray;
- }
-
- .LabelBlue
- {
- font-weight: normal;
- color: darkblue;
- }
-
- .ClassJoined
- {
- font-weight: normal;
- font-size: 50px;
- color: darkcyan;
- }
- </style>
- <title></title>
- </head>
-
- <body>
- <form id="form1" runat="server">
- <div>
- <asp:Label ID="lblMessage" runat="server" Font-Size="25px" Text="Hello, CSharpCorner Users" CssClass="LabelBlue"></asp:Label>
- <br />
- <asp:Button ID="btnChangeCSS" runat="server" Text="Change CSS Class" OnClick="btnChangeCSS_Click" />
- <br />
- <br />
- <asp:Label ID="lblWithoutStyle" runat="server" Text="Text without any style" />
- <br />
- <asp:Button ID="btnChangeStyle" runat="server" Text="Change Style on Click" OnClick="btnChangeStyle_Click" />
- <br />
- <br />
- <asp:Label ID="lblWithoutClass" runat="server" Text="Text without any default class" />
- <br />
- <asp:Button ID="btnWithoutClass" runat="server" Text="Class Attached on Click" OnClick="btnWithoutClass_Click" />
- </div>
- </form>
- </body>
-
- </html>
- using System;
- using System.Collections.Generic;
- using System.Linq;
- using System.Web;
- using System.Web.UI;
- using System.Web.UI.WebControls;
-
- public partial class ChangeCSSClass: System.Web.UI.Page
- {
- protected void Page_Load(object sender, EventArgs e)
- {
-
- }
- protected void btnChangeCSS_Click(object sender, EventArgs e)
- {
- lblMessage.CssClass = "LabelGrey";
- }
- protected void btnChangeStyle_Click(object sender, EventArgs e)
- {
- lblWithoutStyle.Text = "Text with Style";
- lblWithoutStyle.Style.Add("font-size", "50px");
- }
-
-
- protected void btnWithoutClass_Click(object sender, EventArgs e)
- {
- lblWithoutClass.Attributes.Add("class", "ClassJoined");
- }
- }