How to use DropDownList CSS Style in asp.net

DropDownList CSS Style

This example demonstrate how to apply CSS style in asp.net DropDownList control. DropDownList have many built in property To set change design and looking. as like font family, text color, background color, border type, border color, font style etc. But if we want to add more feature then we need to use CSS class. Using this technique you can apply different DropDownList design for different users.

In this example first we create a DropDownList. Write a CSS class on document header section. Then apply this CSS class on DropDownList programmatically. This happen when someone click the button.

DropDownListCssClass.aspx


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

<!DOCTYPE html>

<script runat="server">
    protected void Button1_Click(object sender, System.EventArgs e)
    {
        DropDownList1.CssClass = "DropDownListCssClass";
    }
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>How to use DropDownList CssClass in asp.net</title>
    <style type="text/css">
        .DropDownListCssClass
        {
            color:Snow;
            background-color:DarkOrchid;
            font-family:Comic Sans MS;
            font-size:large;
            font-style:italic;
            }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <h2 style="color:OliveDrab; font-style:italic;">
            How to use DropDownList
            <br /> CssClass in asp.net
        </h2>
        <hr width="350" align="left" color="DarkOliveGreen" />
        <asp:DropDownList 
            ID="DropDownList1"
            runat="server"
            >
             <asp:ListItem Text="Cornsilk"></asp:ListItem>
             <asp:ListItem Text="DarkMagenta"></asp:ListItem>
             <asp:ListItem Text="DeepSkyBlue"></asp:ListItem>
             <asp:ListItem Text="DeepPink"></asp:ListItem>
             <asp:ListItem Text="Pink"></asp:ListItem>
        </asp:DropDownList>
        <br />
        <asp:Button 
            ID="Button1"
            runat="server"
            OnClick="Button1_Click"
            Text="Apply DropDownList CssClass"
            Height="45"
            Font-Bold="true"
            ForeColor="DodgerBlue"
            />
    </div>
    </form>
</body>
</html>

More asp.net examples