Preferred Language:

Listing 6.13 - App_Themes\StyleTheme\SimpleStyle.css

Illustrates how you can use Cascading Style Sheets with ASP.NET themes.

Listing 6.13 - App_Themes\StyleTheme\SimpleStyle.css
Copy 

html 
{
    background-color:gray;
    font:14px Georgia,Serif;
}

.content
{
    margin:auto;
    width:600px;
    border:solid 1px black;
    background-color:White;
    padding:10px;
}

h1
{
    color:Gray;
    font-size:18px;
    border-bottom:solid 1px orange;
}

label
{
    font-weight:bold;
}

input 
{
    background-color:Yellow;
    border:double 3px orange;
}

.button
{
    background-color:#eeeeee;
}

The following page uses the above Cascading Style Sheet.

Listing 6.14 - ShowSimpleCSS.aspx (C#)
Copy 

<%@ Page Language="C#" Theme="StyleTheme" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <title>Show Simple CSS</title>
</head>
<body>
    <form id="form1" runat="server">
    <div class="content">

    <h1>Registration Form</h1>

    <asp:Label
        id="lblFirstName"
        Text="First Name:"
        AssociatedControlID="txtFirstName"
        Runat="server" />
    <br />
    <asp:TextBox
        id="txtFirstName"
        Runat="server" />
        
    <br /><br />

    <asp:Label
        id="lblLastName"
        Text="Last Name:"
        AssociatedControlID="txtLastName"
        Runat="server" />
    <br />
    <asp:TextBox
        id="txtLastName"
        Runat="server" />
        
    <br /><br />
    
    <asp:Button
        id="btnSubmit"
        Text="Submit Form"
        CssClass="button"
        Runat="server" />    
        
    </div>
    </form>
</body>
</html>