Css style : Style « ASP.net Controls « ASP.NET Tutorial

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="UsingCSS" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
   <title>Using CSS</title>
   <style type="text/css">
    body { background: #fffafa; margin: 1em; font: small/1.5em verdana, arial, sans-serif;   }
    h1 { background: gold; font: bold 120% verdana, helvetical, sans-serif; color: black; letter-spacing: 0.25em; padding: 0.25em; }
    .controlPanel { 
          padding: 0.5em; border: black 1px solid;
          background: #eee8a; margin: 1.5em; width: 75%; 
    .pullQuoteOne { 
          padding: 0.25em;
            border: solid 7px #908070;
           border-right-width: 0;
           border-left-width: 0;
          background: lightgrey; 
          float: right;  
          margin: 0.25em 1em; 
          font: bold 90% arial, helvetica, verdana, sans-serif;     
          width: 15em; 
    .pullQuoteTwo { 
          padding: 0.25em;
          background: #adc175; 
          float: left; 
          margin: 1.5em; 
          font: bold 105% times new roman, serif; 
          border: #82a91b 2px solid; 
          width: 10em;
   <form id="form1" runat="server">
         <asp:Label ID="labTwo" runat="server">
        this is a test.
      <div class="controlPanel">
            Modify styles using drop-down lists below:
            Paragraph Text text-transform style:
            <asp:DropDownList ID="drpParagraph" runat="server" AutoPostBack="True" OnSelectedIndexChanged="drpParagraph_SelectedIndexChanged">
               <asp:ListItem Selected="True">Choose a text-transform style</asp:ListItem>
               <asp:ListItem Value="lowercase">lowercase</asp:ListItem>
               <asp:ListItem Value="uppercase">uppercase</asp:ListItem>
               <asp:ListItem Value="capitalize">capitalize</asp:ListItem>
            Pull Quote CSS class:
            <asp:DropDownList ID="drpPull" runat="server" AutoPostBack="True" OnSelectedIndexChanged="drpPull_SelectedIndexChanged">
               <asp:ListItem Selected="True">Choose a css class</asp:ListItem>
               <asp:ListItem Value="pullQuoteOne">pullQuoteOne</asp:ListItem>
               <asp:ListItem Value="pullQuoteTwo">pullQuoteTwo</asp:ListItem>

File: Default.aspx.cs

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class UsingCSS : System.Web.UI.Page

   protected void drpParagraph_SelectedIndexChanged(object sender, EventArgs e)
      if (drpParagraph.SelectedIndex > 0)
         labOne.Style["text-transform"] = drpParagraph.SelectedValue;
         labTwo.Style["text-transform"] = drpParagraph.SelectedValue;

   protected void drpPull_SelectedIndexChanged(object sender, EventArgs e)
      if (drpPull.SelectedIndex > 0)
         labPullQuote.CssClass = drpPull.SelectedValue; 

3.34.1.Test the border properties
3.34.2.set background color programmatically
3.34.3.This is a test of the color properties
3.34.4.Bold font
3.34.5.Working with the Font properties: Font-Italic, Font-Names,Font-Size
3.34.6.Set style attributes
3.34.7.Css style
3.34.8.Using style
3.34.9.Style asp.net server control
3.34.10.Font change