Getting Started with CSS

Step One: Open a New Style Sheet

You can do this by selecting File|New from the program menu, by clicking on the New button, or the Quick Start Wizard button. A popup quick start window will prompt you to select either a New Style Sheet or to Open a Blank Page. Choosing the New Style Sheet button will create an outline of HTML style sheet code.

Step Two: Customize HTML Tags

To customize a tag, select it from the toolbar Pick A Tag drop down box. Your tag will appear in the HTML Source Code Viewer window with the correct CSS coding.

NOTE:

When you insert an HTML tag into a window, It CANNOT BE INSIDE another tag’s brackets. Make sure that each time you pick a new HTML tag, it is placed after the end bracket } of an existing tag. If you put a new tag inside an existing set of brackets { }, your style sheet will not work.

The first tag inserted in this example is the BODY tag.

Notice that the H1 tag was inserted outside of the BODY tag brackets.

à

à

Then click one of the attribute buttons on the right-hand toolbar to set properties for the tag chosen. Any tag can use multiple properties, so apply as many as you like. Your choices of properties include:

Step Three: Test & Save Your Style Sheet

Once you have customized all of the tags desired, be sure to save your changes by clicking the toolbar Save button. You may also want to test your style sheet. Then, when you are satisfied with the results, implement the style sheet into your webpage(s). You can either place the style sheet code directly into your webpage(s) or just add a reference link in your webpage(s) that will point at your style sheet file. See the topic on Saving for a more detailed look at how you can apply your style sheets to webpages.