The HTML <font> size attribute is used to change the size of text inside a <font> element. It allows developers to adjust text appearance directly in HTML.
- The size value ranges from 1 to 7, with 3 as the default size.
- The <font> tag and its attributes are deprecated in HTML5.
- CSS is recommended for modern and flexible text styling.
Syntax
<font size="number">Attribute Values
It contains a single value number that specifies the size of the text. The font size lies between 1 to 7. The default value of font size is 3.
Example 1: This illustrates the use of the font size property, whose value ranges from 1 to 7 in HTML.
<!DOCTYPE html>
<html>
<head>
<title>HTML font size Attribute</title>
</head>
<body>
<font size="1">GeeksforGeeks!</font><br />
<font size="2">GeeksforGeeks!</font><br />
<font size="3">GeeksforGeeks!</font><br />
<font size="4">GeeksforGeeks!</font><br />
<font size="5">GeeksforGeeks!</font><br />
<font size="6">GeeksforGeeks!</font><br />
<font size="7">GeeksforGeeks!</font>
</body>
</html>
Note: If you do not specify a font size, the default size for normal text, like paragraphs, is 16px (16px=1em).
Example 2: This illustrates the use of the size attribute inside the <font> tag in HTML.
<!DOCTYPE html>
<html>
<head>
<title>HTML font size Attribute</title>
</head>
<body>
<font size="7" face="verdana" color="green">
GeeksforGeeks!
</font>
<br>
<hr>
<font size="6" face="arial" color="#008000">
GeeksforGeeks!
</font>
<br>
<hr>
<font size="5" face="sans-serif" color="rgb(128, 128, 0)">
GeeksforGeeks!
</font>
<br>
<hr>
<font size="4" face="times new roman" color="#008000">
GeeksforGeeks!
</font>
</body>
</html>
Example 3: Here, we have used the font size attribute & set it to different values in order to display similar to the use of HTML heading & paragraph.
<!DOCTYPE html>
<html>
<body>
<font size="6" face="sans-serif" color="green">
GeeksforGeeks
</font>
<br>
<hr>
<font size="3" face="Comic sans MS">
Learn Data Structures Online At
Your Own Pace With The Best Of Faculty
In The Industry. The Best Data Structures
Course Available Online From
Skilled And Experienced Faculty.
</font>
</body>
</html>
Note: Modern web development favors CSS for styling, offering greater flexibility and compatibility across browsers. Developers should adopt CSS for text size adjustments and embrace current best practices for web design.