1.2 Inline/Hardcoding Styles

« Previous Chapter

Next Chapter »

The other styling technique you can use when developing a Website with ASP.NET is through a Visual Control’s Properties.

For example:

1. Select the GridView Control
2. Go to Properties Window (You can use F4)
3. Add necessary style information in the Appearance Category

GridView Control Appearance Properties

When styles are applied using the properties window of the ASP.NET Control, the style information is stored in the control’s markup. This type of Styling is called inline styling as styling details like the font, color, and border width are all defined in the code of the control. Inline styling method hardcode markup values and this is not recommended by many programmers.

Below is a code snippet of the GridView control showing hardcoded inline Styles added to it via the Properties Window.

<asp:GridView ID="GridView1"
    runat="server" AutoGenerateColumns="False"
    BackColor="#b2b2b2" BorderColor="#999999"
    BorderStyle="Solid" BorderWidth="2px"
    CellPadding="2" CellSpacing="2"
    DataKeyNames="ProductID"
    DataSourceID="SqlDataSource1"
    ForeColor="Black" Font-Bold="true" />

Inline styling can be easy to apply, but as your website becomes larger and more complex, it might be a difficulty to maintain consistency throughout. For instance, if you decide to change Border Color used on the grid, you would need to open every individual page and find the Control and go to the Properties window and change the Border Color value. This is the reason why many programmers like to store Styles in a common place which can be accessed and applied to the whole web site (will be shown in Chapter that follow).

« Previous Chapter

Next Chapter »

Table of Contents

Chapter 1 - Placing Style Rules
        Chapter 1.1 - Visual Studio Auto Format
        Chapter 1.2 - Inline/Hardcoding Styles
        Chapter 1.3 - Local Style Tag
        Chapter 1.4 - ASP.NET External CSS
Chapter 2 - Visual Studio Style Sheets Tools
        Chapter 2.1 - Using ASP.NET External CSS
        Chapter 2.2 - Generated Styles
Chapter 3 - Styling with Master Pages
        Chapter 3.1 - Creating Styled ASP.NET Master Page
        Chapter 3.2 - Connecting Styled ASP.NET Master Page to Regular Page
Chapter 4 - ASP.NET Themes and Skins
        Chapter 4.1 - Creating an ASP.NET Theme
        Chapter 4.2 - Applying Theme to a Web Site
        Chapter 4.3 - Applying Theme to a Page

[top]