Home > Article > Web Front-end > Set keyword font size using CSS
Set keyword font size using CSS
- 王林forward
- 2023-09-13 14:13:01718browse
CSS font-size property can be set using absolute and relative keywords. This will scale the text as needed.
Syntax
The syntax of CSS font-size attribute is as follows-
Selector {
font-size: /*value*/
}The following table lists the standard keywords used in CSS-
| Sr.No | Value &Description |
|---|---|
| 中Set the font size to medium. This is the default | |
| xx-small#set sets the font size to xx-small size | |
| x-small Set font size to special Small | |
| SmallSet the font size to a smaller size
|
|
| ##large | Set font size to large |
| x-large | Set font size to extra large |
| xx-large |
Set font size to xx-large size
|
| Smaller |
Set the font size to be smaller than the parent element
|
| Bigger | Set the font size to a larger size than the parent element |
Example
Live Demonstration
<!DOCTYPE html>
<html>
<head>
<style>
h1{
font-size: larger;
}
#demo {
font-size: medium;
text-align: center;
background-color: floralwhite;
}
p {
font-size: xx-large;
}
</style>
</head>
<body>
<h1>Demo Heading</h1>
<p id="demo">This is demo text.</p>
<p>This is another demo text.</p>
</body>
</html>Output
This gives the following output-
Example
Live Demonstration
<!DOCTYPE html>
<html>
<head>
<style>
div {
margin: auto;
padding: 5px;
width: 30%;
border: 1px solid;
border-radius: 29%;
text-align: center;
font-size: xx-small;
}
p {
font-size: xx-large;
}
</style>
</head>
<body>
<div>
<div>One</div>
<p>Two</p>
</div>
</body>
</html>Output
This gives the following output-
The above is the detailed content of Set keyword font size using CSS. For more information, please follow other related articles on the PHP Chinese website!
Statement：
This article is reproduced at:tutorialspoint.com. If there is any infringement, please contact admin@php.cn delete