Create New Style Definition

 

Introduction

The Create Style Dialog is helpful for creating new style definitons. If you would like to create style definitions that you can easily add to your document, these instructions show you how.

First you need to open the Cascading Style Sheets resource panel:

  1. In the View menu, select Resource Manager.

  2. In the Resource Manager submenu, select Cascading Style Sheets.

Now you need to create a new style sheet, which you can use to add style definitions.

  1. Do one of the following:

  1. Enter a name for your new style sheet in the Create New CSS File dialog. Notice that the Cascading Style Sheet resource panel now lists the name of your new style sheet under HotDog6 Default Style Sheets. For example, if you named your style sheet my_own_styles then my_own_styles.css should appear.

You can now use this style sheet to define your own style definitions.

Adding New Style Definitions

  1. Select the style sheet to which you wish to add a style definition.

  2. Do one of the following:

  1. In the Create New Style dialog, use the drop-down list to select the type of tag for which you want to create a style. The options are:

Character Style

Selecting this option allows you to create a style for HTML tags that affect text within a paragraph, called inline style. Inline or Character Style HTML tags include such tags as <B>, <I>, and <A>.

Paragraph Style

Selecting this option allows you to create a style for HTML tags that affect the appearance of an entire paragraph. Paragraph Style HTML tags can't be used "inline" because they automatically force the text to which they apply to become a paragraph. That is, they add a carriage return before and after the text. Paragraph Style HTML Tags include tags such as <H1> and <DIV> and the attributes for the <P> tag.

Document Style

Selecting this option allows you to create a style for HTML tags that affect the appearance of an entire document. Document Style HTML Tags include the <BODY> tag and the attributes for the <A> tag.

Selector

A selector is a special type of style definition that can be applied to any tag using the CLASS attribute. For example, if you give the style def:

<SPAN CLASS="Selector_Name>text</SPAN>

Define Own Style

Select this option if you wish to define your own particular style.

  1. After selecting a style type, press Next.

  2. From the list that appears select the tag to which you want to define a tag.

  3. Click "Finish".

The Style Editor dialog now opens allowing you to create a style definition for your new style.

Advanced Features

These features let you create selector, psuedo selector and or contextual selectors. For more information see:

http://www.w3.org/TR/REC-CSS1.

Advanced Users of Style Sheets

  1. Select "Define Own Style" from the list box.

  2. Click "Next".

  3. Add your tag name. (It is not nessescary at this stage to include any selector, contextual selector or psuedo selectors at this stage).

  4. Click "Advanced".

  5. Define any classes you want.

  6. Click "Finish".