Font Size in CSS

CSSWeb DevelopmentFront End Technology

The CSS font-size property is used to set the size of font. We can specify the value in percentages, units like pixels, cm, points, em, etc. and absolute keyword. Relative values maximize accessibility. The default font-size is 16px or 12pt.

Syntax

The syntax of CSS font-size property is as follows −

Selector {
   font-size: /*value*/
}

The following examples illustrate CSS font-size property −

Example

 Live Demo

<!DOCTYPE html>
<html>
<head>
<style>
div {
   margin: auto;
   padding: 10px;
   text-align: center;
   width: 50%;
   border: 2px solid;
   border-radius: 15%;
   font-size: 1.4em;
}
</style>
</head>
<body>
<div>
one
<div>two
<div>three</div>
</div>
</div>
</body>
</html>

Output

This gives the following output −

Example

 Live Demo

<!DOCTYPE html>
<html>
<head>
<style>
p {
   font-size: smaller;
}
#demo {
   font-size: initial;
}
p:last-of-type {
   font-size: 200%;
}
</style>
</head>
<body>
<h2>Demo Heading</h2>
<p>This is demo text 1.</p>
<p id="demo">This is demo text 2. </p>
<p>This is demo text 3.</p>
</body>
</html>

Output

This gives the following output −

raja
Published on 09-Jan-2020 11:26:29
Advertisements