Tip #10 Did you know… Visual Web Developer 2008 has a New Style Builder Dialog?

  • Article

Visual Studio 2008 has a New Style builder dialog. This dialog box helps you design new styles and also preview it at the same time. Using this dialog, you can create a style which can live in current page, an existing external style sheet or a new external style sheet. You can create styles which are ID-based, element-based, in-line, class-based and styles which have complex selectors.

To invoke the “New Style” dialog go to  Format Menu-> New Style option. You can also invoke this dialog via the Apply Styles and Manage Styles tool windows.

Here is how the dialog looks like:

 New Style

Here are the various sections of this dialog box:

  • Define in: You can define your newly created style in Current page, New Style Sheet or an Existing Style Sheet.
  • Selector: You can type your own or select from the existing drop down. For example to use an inline selector, select (inline style) from the drop down.
  • Apply new style to document selection: Checking this checkbox will apply the style to the selected control in your designer.
  • Category: Clicking on each category will bring up associated properties on the right hand side of the dialog. Any category which has properties set will appear in bold. In the picture above you can see that Font, Background and Border are bold as they have a few properties set.
  • URL: This needs to be set only if you want to place your newly created style in an external style sheet. This should indicate the path to a .css file.

Now if you want to create a style for your button control in designer, all you need to do is select the button control in designer, bring up the New Style dialog, set the various properties you want, preview it and click Apply button.

Simple right?

Reshmi Mangalore

SDET, Web Development Tools