HTML Font Size | Tag, Code, Css, Style | px, em, small, bold

There are 2 terms that come when you going the change HTML font size. First is changing the size of text using a <font> tag and the other is using CSS style attribute. You will learn all the methods of HTML Text Size. For example how to make text font size small or bigger, what is px and em etc.

HTML Font Size  and text Tag, Code, Css, Style px, em, small, bold


A syntax of HTML font size tag.

<font size="number">

Using Headings – H1..H6


Syntax inline CSS change text size HTML.

 <p style="font-size: 46px;"> Text </p>

HTML font size tag example

A Font Tag is used in outer text tag like <p>, <h4> etc, with a size=”number” attribute. See the below HTML font size code example. A value of the size attributes not required any measurement unit like px, it can be just a number.

A Size attribute specify size of text inside <font> element.

Output: See below the visual difference between text size of the same kind of tag.

HTML font size tag example output

Font size in HTML | HTML font-size CSS | Style

Above you see the example of HTML font size tag. But it can be done with CSS property font-size. A using Css will element <font> tag. It will easier and make an impact on across applications.

Let’s see the example of HTML font-size CSS. Using this way can change many tags (need the same id or class). Here using an Internal CSS in the <head> tag section.


You can also use an HTML font-size style attribute. (it will again as single element change)

Inline CSS: Font size in HTML style code.

CSS Syntax

<....font-size:medium|xx-small|x-small|small|large|x-large|xx-large|smaller|larger|length|initial|inherit;>...... <...>

HTML Font size px | em | small | Bold

What is HTML font-size px

A px stand for pixel. Which smallest single component of a digital image.

In HTML It means a dimension, measured in pixels on-screen. E.g.

font-size: 10px;

HTML font size em Used?

A HTML <i> and <em> Elements are not use for change size of text. But its use for for defines italic text.

<em> element defines emphasized text.

<i> element defines italic text.

Set HTML Font size small

Can use text size using a string in any type of CSS.

How to do font size style bold in HTML?

Use HTML <b> and <strong> Elements to bold a text. Both work and look same.

A change font size in HTM is easy and has many ways. If you have any doubts and suggestions or examples for this tutorial, then do comment below. Other tags like h1, h2…h6 also use to define the different sizes of the text.

Do comment if you have any doubts and questions.

Note: The All How to change the Font size in html examples are tested on Safari browser (Version 12.0.2).
OS: macOS 10.14 Mojave
Code: HTML 5 Version

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.