How to Change Font Size in HTML
Before HTML 4.0, properties of font such as size could be manipulated through the "font" tag. This tag is now gone. The World Wide Web Consortium (W3C) has removed it from its list of recommendations because it isn't helpful to programmers. The display properties of fonts in a webpage are manipulated by cascade style sheets (CSS). But because the old "font" tag is still supported, this article focuses on both ways of changing fonts.
Other People Are Reading
Instructions
-
Manipulate Fonts Through the
-
1
Open an HTML file in a text editor. Place a "font" tag inside the "body" tags of an HTML page. Write some text between the begin and end parts.
-
2
Insert a "size" property in the opening tag and give it a value of one, as shown in the example below. Save the source file with the code below, refresh the web browser and observe the size of the font.
Example:
< body >
< font size=1 > Text < / font >
< /body >
-
-
3
Change the value of the "size" property in Step 2 to 7. Save the source file, refresh the monitor and notice the new font size.
Manipulate Fonts Through Style Sheets
-
4
Place a "header" and a "paragraph" tag between the "body" tags of an HTML page. These are the regular header and paragraph tags from HTML 3.2. Write text between the begin and end part.
-
5
Insert a "style" property in the open part of both types. The value taken by a "style" is the "font-size" modifier, followed by a colon and followed by a percent. The entire value is within double quotes. The font size is controlled by the percent figure. It ranges from 0 and has no upper limit. If no number is given the size defaults to 100 percent. Save the source file with the code below, refresh the browser and take note of the font size.
< body >
< h1 style="font-size:120%" > Heading < /h1 >
< p style="font-size:50%" > Paragraph < /p >
< /body >
-
6
Change the percent values to some other number, save and refresh. The percent number has no upper limit which means it can exceed 100. Observe how the font size changed.
-
1
Tips & Warnings
Not providing a "size" attribute defaults the fonts to the equivalent of size 3.
With CSS the size of font can be increased/decreased by very small increments compared to the 7 steps of HTML 3.2.
HTML 3.2 and the "font" tag, although still supported, are obsolete.
When you open an HTML tag, make sure you close it.
