How to Change Font Size (CSS)

CSS can be used to change your font size anywhere that allows it, including your MySpace profile, journal layout, personal blog or website. If you want to make your text super-tiny, or broadcast your opinion with extremely large text, here is how to change your font size using CSS:

NOTE: Some of the codes in this article have an asterick (*) at the beginning of them so you can see what they look like in plain text. You MUST remove the * order for the codes to work.

Difficulty: Moderately Easy

Instructions

1. The Basic Code to Change Font Size
   
   To change font sizes, use the attribute “font-size,” shown below:
   
   font-size: ##px;
   
   You can change your font size using pixels, denoted by 'px.' Replace '##' with the size – in numbers – that you want your text to be.

2. Changing the Pixel Value
   
   By default, all text is size 16px. Any number smaller than 16 will create small text: 10, 9, 8, 7, 6, and so on. 8px will create tiny text, while anything smaller than 8px is usually impossible to read. Keep in mind that small text can be very hard on readers' eyes, so a good rule of thumb is to never go smaller than 10 or 12.
   
   To make text larger, use any number higher than 16px. 20px will create header-sized text, while 30px will create very large text. 100px will create text so large that only a sentence will fit on the page. You can make text as large as you want – there is no limit – but keep in mind that going higher than 100px will create an extremely long and annoying page, and will turn readers away. Use large text sparingly, like for headers and titles.

3. Changing the Font Size for an Entire Page
   
   Using the 'font-size' code above won't work until you specify what should be changed. To change the entire page or profile's font size, you should place the 'font-size' attribute in the 'body' section of your CSS code:
   
   <*style type="text/css">
   
   body {
   font-size: 10px;
   }
   
   <*/style>
   
   With this code, every word on your page or profile will display in a 10 point size.
   
   You can also change the font size for certain sections of text: tables, frames, DIVs, and so on. For instance, if you are using tables, and would like the change the font size of just the text inside the tables, you would use this code:
   
   <*style type="text/css">
   
   table {
   font-size: 10px;
   }
   
   <*/style>
   
   
   Change 10px to the size you want your text to display

4. Changing the Size of One Word/Sentence/Paragraph
   
   
   If you want to change the font size of just one or two words, a sentence, or a paragraph, you can also use CSS to do so. However, this code will not go between opening and closing tags; instead, the text will go between two tags that change the size for just those words:
   
   
   <*font style="font-size: 12px;">This text will display in 12-point font size.<*/font>
   
   
   Place these tags around any text where you want to change the font size. Change “12px” to the point size you want your text to be. Don't forget the closing tag, or everything that comes after the opening tag will also have the same font size!

[wysiwyg4]

on 10/19/2009 What's the difference between 8px and 08px.