Thuộc tính kích thước phông chữ CSS có thể được đặt bằng các từ khóa tuyệt đối và tương đối. Điều này chia tỷ lệ văn bản như mong muốn.
Cú pháp
Cú pháp của thuộc tính font-size CSS như sau -
Selector {
font-size: /*value*/
} Bảng sau liệt kê các từ khóa chuẩn được sử dụng trong CSS -
| Sr.No | Giá trị &Mô tả |
|---|---|
| 1 | phương tiện Đặt kích thước phông chữ thành kích thước trung bình. Đây là mặc định |
| 2 | xx-small Đặt kích thước phông chữ thành kích thước xx-small |
| 3 | x-small Đặt kích thước phông chữ thành một kích thước cực nhỏ |
| 4 | nhỏ Đặt kích thước phông chữ thành kích thước nhỏ |
| 5 | lớn Đặt kích thước phông chữ thành kích thước lớn |
| 6 | x-large Đặt kích thước phông chữ thành kích thước cực lớn |
| 7 | xx-large Đặt kích thước phông chữ thành kích thước lớn xx |
| 8 | nhỏ hơn Đặt kích thước phông chữ thành kích thước nhỏ hơn thành phần mẹ |
| 9 | lớn hơn Đặt kích thước phông chữ thành kích thước lớn hơn phần tử mẹ |
Các ví dụ sau minh họa cách có thể đặt thuộc tính kích thước phông chữ CSS với từ khóa.
Ví dụ
<!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> Đầu ra
Điều này cho kết quả sau -
Ví dụ
<!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> Đầu ra
Điều này cho kết quả sau -
