Creating a Custom CSS Style

(1) You will need the CSS Panel open from the Window Menu.

(2) You need to select New Style either from the Menu Selector or from the New Style button

(3) In the New Style Dialogue Box select Make Custom Style Give your style a name. Click the radio button Make Custom Style. If you click This Document Only it will only apply to this page. If you click New Style Sheet File it will save it as an external syle sheet that can be applied to all your pages.

(4) The Style Definition Box now opens where you define your style(s)

(5) You can select settings for all the panels detailed below at one time before you click OK to save.

(6) To apply the style you must have the Styles Panel open with the name of the saved style visible. Drag across the work you want to apply the style to and click on the saved style in the Styles Panel.

Have look at the details of the 8 style settings available in text file

Creating An External Style Sheet

An external stylesheet is a file containing all the CSS styles you want to apply. These can be created and attached or linked to a page. The style sheet is created in the normal way

(1) Go to CSS Panel and select New Style

(2) In the New Style dialogue box give it a name and select New Style Sheet and then OK. You are then prompted for a file name for your external file.

(3) This page is linked to an external CSS file called learn.css. The page has 3 Type Panel styles one for the body text, one for top box and one for subheadings. You can see the links as little chains. The link is stored as code in the Head area.
<link rel="stylesheet" href="learn.css" type="text/css">

(4) To link it to a page you click on Attach Style sheet button on the CSS Styles Panel or right click in panel and select Edit Style Sheet or Attach Style Sheet. If you select the former you then click on Link. In link you have a choice to add the code to link or import an existing style sheet. Link does the same as attach, import adds it to the document each time your document is loaded.

Why do this?

• It adds uniformity and gives a more professional look
• You do not have to set type face or sizes etc. All you have to do is mark the text and click on the style from the CSS Styles Panel