How to auto adjust font size using CSS ?

How to Change Font Size using CSS?

Last Updated : 17 Nov, 2024

The CSS font-size property is used to change the font size of text.

CSS font-size Property

The font-size property in CSS sets the size of the text of HTML elements. Values can be in pixels, percentages, em, rem etc.

Syntax

font-size: value;

Example: We can use various font-size units like - em, smaller, percentage, px, and predefined size keywords (x-small).

HTML

<div style="font-size: 1.2em;">FontSize 1.2em</div>
<div style="font-size: smaller;">FontSize smaller</div>
<div style="font-size: 80%;">FontSize 80%</div>
<div style="font-size: 12px;">FontSize 12px</div>
<div style="font-size: x-small;">FontSize x-small</div>

Output

font-size-property — font-size property

Example: We can use various font-size units like - rem, larger, percentage, px, and predefined size keywords (large).

HTML

<p style="font-size: 1.5rem;">FontSize 1.5rem</p>
<p style="font-size: larger;">FontSize larger</p>
<p style="font-size: 120%;">FontSize 120%</p>
<p style="font-size: 24px;">FontSize 24px</p>
<p style="font-size: large;">FontSize large</p>

Output

font-size-property — font-size property

How to auto adjust font size using CSS ?

A

anshubajaj911

Improve

Article Tags :

Similar Reads

How to change font size using jQuery ?

In this article, we will see how to change the font size of an element using jQuery. To change the font size of an element, we will use css() method. The css() method is used to change the style property of the selected element. Syntax: $(selector).css(property) Return value: It will return the valu

How to auto adjust font size using CSS ?

The font-size-adjust property of CSS tells the browser to adjust the font size of the text to the same size regardless of font family. When the first chosen font is not available, the font-size-adjust property allows you more control over the font size. If a font isn't available, the window defaults

How to Change Font Style in CSS?

Font style is an important element that enhances the readability of the text. CSS provides several properties to change the text appearance and font style. The font style property allows you to define how the text should appear normal, italic, or oblique.Table of ContentDifferent Methods to Change F

How to Include a Font .ttf using CSS?

To include a .ttf font in a web project using CSS, you can use the @font-face rule, which allows you to load external fonts and use them throughout your site. Here's a step-by-step guide on how to include a .ttf font using CSS:Steps to include font .ttf using CSS:Step 1: Download a .ttf font file fr

How to Change Font Size in HTML ?

To change the font size of any text we can use the CSS font-size Property, or some HTML keywords have some fixed font size but we change them by using this CSS property. We can use style attributes in the HTML. As we know, HTML has no <font> tag, so we are using CSS style to add font size. The

How to Change the Size of the Pagination using CSS ?

Pagination is an important user interface component that enables navigation through a set of pages. We can customize this element by adjusting its size. These are the two different approaches to customize and change the pagination size using CSS: Table of Content Using font-size PropertyUsing Scalin