Find out how to use CSS Styles to format text in web site. Cool tips included.

CSS Styles are the easiest and best way of formatting text in a web site. You can simply make a style with a specified font type, size and color and use it all over the site instead of cluttering your HTML code with endless font tags. Styles can be used in tables, rows, cells and be used for form objects. When you use style sheets, its possibilities are endless. Here are the various ways of using styles in this tutorial.

Learn how to create a style sheet in Dreamweaver. Simply follow these steps:

1. Open the CSS Styles palette by clicking on Window>CSS Styles
2. Click on the '+' icon to create a new style. You'll get the pop-up box as shown. Write the name of your style e.g. 'text', choose 'Make Custom Style' and click OK.
3. Create your own custom style by choosing the font type, size, weight, color etc. Click on Ok. You have created a style. Repeat these steps if you want to create more styles for titles, subtitles, links etc.
   

 

Applying styles to text

If you have completed and created your styles then you can apply the style to your text. Simply select the text and click on the style in CSS Styles palette.

HTML Code: When you use styles you have to set a 'class' e.g. <td class = "text">. Here, all the contents of the cell will catch on the style called 'text'.

Cool CSS Style Tips!

• Use the a:hover attribute to make cool text rollovers. Learn more
• By using the attribute 'none' to remove the underline in links. Learn more.
• By giving a background color and font to customize form objects. Learn more.
• Try out the 'Line Height' correctly in your style to give more line spacing.
• Apply the default text style to the the table cell. All the text within the cell will be taking the default font. The code will be like this: <td class="Name of Style">
• Better to link your pages to an external style sheet rather than creating a style within a particular document. If you ever need to change a commonly used font you just change it in the style sheet and the change will automatically get updated in all documents that use that style.