New Style and Modify Style Dialog Boxes

The New Style and Modify Style dialog boxes provide options that let you define or modify cascading style sheet (CSS) style attributes. A CSS style combines individual formatting and positioning attributes into an attribute set that you can apply all at the same time.

The New Style dialog box is divided into two panes. The top pane enables you to select where the style is defined and which element or class the style is applied to. The bottom pane lists nine general categories (Font, Block, Background, Border, Box, Position, Layout, List, and Table). When you select a category, the bottom pane shows the options for the selected category. As you select style options, the New Style dialog box creates CSS style definitions for you.

The options in the Modify Style dialog box correspond to those of the bottom pane of the New Style dialog box. The Modify Style box is available when you are editing a style sheet. The New Style dialog box is available when you are editing an HTML or ASP.NET page.

The New Style Dialog Box

To open the New Style dialog box and define a style

1. Click Format on the main menu and then click New Style.

   The New Style dialog box appears.

2. In the Selector drop down list, either select an HTML element or type a class name that will contain the style definition.

   A class name must be preceded by a period (.).

3. In the Define in drop down list, select to define the style either in the current Web page, in a new style sheet that will be added to the Web site, or in an existing style sheet. Styles defined in the current Web page can only be applied to elements within that page. External style sheets let you define a common appearance for more than one Web page.

   If you select an existing style sheet, define its location in the URL text box.

4. Select the Apply new style to document selection check box if you want the currently selected item in the Web page to be displayed by using the style properties.

5. Select an option from the left pane and define the CSS style attributes.

The Modify Style Dialog Box

To open the Modify Style Dialog Box

• Do one of the following:

  • Right-click the style sheet in the editor, and then from the shortcut menu, choose Build Style.

  • In the Style Sheet Toolbar, choose Build Style.

  The Modify Style dialog box is displayed.

  The options in the dialog box are the same as those in the bottom pane of the New Style dialog box.

Tasks

Walkthrough: Basic HTML Editing in Visual Studio for Web Forms Pages 

Walkthrough: Creating and Modifying a CSS File

UI Elements

See Also

Working with CSS Overview