Home » Resources » Dreamweaver CS4 Tutorial » Changing the font size

Part 3.3: Changing the font size

This section describes how to make your text larger or smaller. All this is covered in our comprehensive Dreamweaver training course.

Different methods are described for one-off changes to small blocks of text, and changes to size that you want to make for a whole class.

One-off changes:

Select the piece of text you want to change the font size for with the cursor

In the Properties pane at the bottom of the screen, click on the CSS button (see picture)

The “Size” field will be set to 100% by default.

Change the font size to 150% and press enter

The “New CSS Rule” box will appear again, so create another new class called “largertext” and save it to your “twoColLiqLtHdr.css “ stylesheet in the Rule definition box as before.

This may seem a long winded way of changing text size now, but once you have all of the classes you need for your site set up it is a much easier and tidier way to work.

Size changes made to a whole class:

Place your cursor within a large block of text that you applied your “coursedescription” style to earlier.

Now open up the “CSS Styles” panel on the right hand side of the page again (as described above) and double-click on the font-family line to open up the CSS Rules Definition box

Change the font size to 90%

Press OK

All text in the coursedescription class will now be reduced to 90% size

Note that in addition to the font size, you can also make changes to the font weight (e.g. bold), style (italic) of your class – along with a range of other options.

Similar resources you may like

1. Working with Text in Dreamweaver CS4
2. CSS (Cascading Style Sheets)
3. How to change fonts in Dreamweaver
4. Different Coloured Text
5. Making bold or italic text

Tags

Dreamweaver, dreamweaver cs4, Dreamweaver Training, dreamweaver tutorial, Dremweaver Resources, font, Free Dreamweaver Training, size, text, Web Design Tutorial

Share This Resource

This entry was posted by Colin Welch on Monday, March 16th, 2009 at 10:36 am and is filed under Dreamweaver CS4 Tutorial. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.