We can specify the font-size in pixels to make the text use only a specific number of pixels. The pixel size is based on the resolution of the screen and the algorithm used by the browser to calculate it.
Syntax
The syntax of CSS font-size property is as follows −
Selector {
font-size: /*value*/
}Example
The following examples illustrate how CSS font-size property is set in pixels −
<!DOCTYPE html>
<html>
<head>
<style>
span {
background-color: darkseagreen;
padding: 20px;
font-size: 15px;
}
span:nth-child(3) {
font-size: 55px;
}
span:last-child {
font-size: 25px;
}
</style>
</head>
<body>
<br/>
<span>one</span><span>two</span><span>three</span>
</body>
</html>Output
This gives the following output −
Example
<!DOCTYPE html>
<html>
<head>
<style>
div {
width: 40%;
border: 2px solid yellow;
padding: 20px;
font-size: 10px;
}
div:nth-child(3) {
font-size: 20px;
}
div:last-child {
font-size: 30px;
}
</style>
</head>
<body>
<br/>
<div>one</div>
<div>two</div>
<div>three</div>
</body>
</html>Output
This gives the following output −
