Skip to content

Change HTML font size and color | Example code

  • by

HTML font size and color easily change Using CSS (Cascading Style Sheets.). Where CSS uses color and font-size property.

Examples: how do you change font size and color in HTML?

You can use all types of CSS (Inline, Internal and External CSS) to change color and font of font (text) in HTML.

Inline CSS for Single text change

Specify the font color and the font size with font-size in p tag as shown in the example below.

<!DOCTYPE html>
<html>

<body>
    <p style="color:Blue; font-size: 20px;">This text is Blue, and 20px.</p>
</script>
</body>
</html>

Output:

Change HTML font size and color

Internal CSS for Single code for multiple tags

Insert code between “<style><style>” the tag to change the appearance of your text in various elements. The style tag will be inside the head tag.

A class name is needed to change the text style. If you want to the same style to another HTML web page then use External CSS (the same code will be used).

<!DOCTYPE html>
<html>

<head>

    <style type="text/css">
        .custom {
            color: red;
            font-size:20px;
        }
    </style>
</head>

<body>
    <p class="custom">This text is Red, and 20px.</p>
</script>
</body>
</html>

Output:

Do comment if you have any questions and answers on this topic.

Note: The All HTML Examples codes are tested on the Firefox browser and the Chrome browser.

OS: Windows 10

Code: HTML 5 Version

Leave a Reply

Discover more from Tutorial

Subscribe now to keep reading and get access to the full archive.

Continue reading