Changing Font Sizes Using HTML: Help with Basic Code

Make Web Pages Attractive and Well-Organized by Changing the HTML Font Size

Knowing how to change the HTML font size on your webpage is almost always necessary when creating an attractive, well-organized and sophisticated site.  You can use the technique to organize, separate and offset information, and generally improve the overall look of your webpage.  If you are unfamiliar with HTML coding, you need to find help that will take you through the changes, step-by-step. This article will provide that help for beginners.

Here are the steps you can follow to learn how to change your font size using HTML on your webpage:

  1. Know how to construct the font tag using HTML basic code.  The HTML font tag (with the size attribute) is constructed like this:

    <font size="#">The text you want to change size goes here.</font>

    You must insert the size you want in the area that holds the # sign.  You can insert a number 1 through 7.  Watch what happens when I use this tag.

    <font size="5">This text is larger than the default</font>

    It creates this effect by converting through the HTML code:

    This text is larger than the default

    In this case, size 1 is the smallest and size 7 is the largest.

  2. Decide how you want to use your font sizing for your web page.  Changes in font size can be used in many different ways.  To create headers, you do not need to use the HTML fonts tag (in Step 1) at all.  You can simply use the header tag, which looks like this: <h#>.  The # sign should be replaced by a number, 1-6.  When using this tag, one is the largest and six is the smallest.  This tag not only changes the size of your font, but also creates a space above the header and between the header and the text following. 

    Another simple way to change font size is to use the <big> tag.  This tag will alter the size of your text, and you can add as many as you'd like (up to about five) and the effect will continue to grow stronger.  Consider the line directly below, for example:

    <big>This text is big!</big>

    It will create this effect:

    This text is big!

    Now check out what is written here:

    <big><big><big>This text is big!</big></big></big>

    This is what it will create:

    This text is big!

    There are many other ways to utilize font size when you learn HTML; however, and these will mostly include the HTML tags.  If you want to emphasize text precisely without creating line breaks, or wish to create an ornate effect like the one directly below, then you will use the font tag.

    Once upon a time. . .

    The code for the "ornate" effect above is:  <font size="7">O</font>nce upon a time. . .

  3. Copy the tag into the body of your HTML.  Copy and paste (or write in) the tag you've constructed to the place on your webpage where you want your text size to be changed.  All text that you want in the specified size should fall between the <font size="#"> and </font> tags.

Hopefully, this HTML tutorial has been helpful for assisting with the creation of your website or other online pages.


Share this article!

Follow us!

Find more helpful articles: