Create a style
You can create inline styles and styles that use class, ID, or element selectors to format a web page and its content. For information about each type of style, see Styles overview.
You can create new styles either from scratch or by copying an existing style. Either way, the New Style dialog box enables you to define everything about your new style, including the selector type, properties, and the style sheet that will contain the style. When you want to create a new inline style, you can also use the CSS Properties task pane. When you want to quickly create and apply a new style in your page without setting any properties for the style, you can also use the Style toolbar.
Note
If a CSS property is not supported by the CSS schema that is selected in the Authoring tab of the Page Editor Options dialog box, the list of values for that property appears blank in the New Style and Modify Style dialog boxes and the property is not listed in the CSS Properties task pane. For more information, see Set IntelliSense options for CSS.
To create a new style by using the New Style dialog box
Do one of the following:
To add a style to an external CSS, open the .css file.
To add a style to an internal CSS, open the web page.
To add an inline style, open the web page, and then select the content you want to style.
Do one of the following:
To create a new style, in the Apply Styles task pane or the Manage Styles task pane, on the Style toolbar, or on the Format menu, click New Style
.gif "Cc295329.fef5e39f-6654-405a-bead-a0ece0e71fb9(en-us,Expression.10).gif")
.To copy an existing style in the Apply Styles, Manage Styles or CSS Properties task pane, right-click the style that you want to copy, and then select New Style Copy.
In the New Style dialog box, do the following:
Use this
To do this
Selector
To use a class selector, type a period (.) followed by a unique name.
To use an ID selector, type a number sign (#) followed by a unique name.
.gif "Note")
Note:
Class and ID selector names can't contain spaces unless you're creating a complex selector.To use an element selector, either type the name of an HTML element or click the Selector drop-down box and select an element name.
To use an inline selector, select inline style.
To create a complex selector, type the selector.
Define in
Select one of the following:
Current page adds the new style to the internal CSS in the current web page.
New style sheet adds the new style to a new blank external CSS.
Existing style sheet adds the new style to an existing external CSS that you specify.
Apply new style to document selection
Apply the style to the current selection in the current web page.
URL
If you selected Existing style sheet in Define in, enter the URL to the .css file.
Category
Select any of the following, and then set the properties that appear to the right in the dialog box:
.gif "Tip")
Tip:
Categories that appear in bold in the Category list contain set properties.Font sets font properties, including size, weight, decoration and color.
Block sets line-height, text alignment, text indentation, and text spacing.
Background sets background color and background image properties.
Border sets a border and its properties.
Box sets the padding and margin properties of box and block-level elements.
Position sets the dimensions and position of box and block-level elements.
Layout sets the visibility, floating and wrapping behavior, clipping and other layout properties of box and block-level elements.
List sets the properties of list elements, including type, position, and image.
Table sets the properties of table-related elements, including spacing, layout, border properties.
To create an inline style by using the CSS Properties task pane
In Design view or Code view, in your web page, select the content you want to add an inline style to.
In the CSS Properties task pane, under Applied Rules, either right-click the selector you want to apply the inline style to or if "(no rules applied)" appears then right-click anywhere under Applied Rules, and in the shortcut menu, click New Inline Style.
Under CSS Properties, set the properties you want.
To create and apply a new undefined style
In Design view or Code view, in your web page, select the item you want to apply a style to.
To create and apply a new style without defining any properties, in the Style toolbar, in either the Class or ID box, type a unique name for the new style.