เราสามารถระบุขนาดตัวอักษรเป็นพิกเซลเพื่อให้ข้อความใช้จำนวนพิกเซลที่กำหนดเท่านั้น ขนาดพิกเซลขึ้นอยู่กับความละเอียดของหน้าจอและอัลกอริทึมที่เบราว์เซอร์ใช้ในการคำนวณ
ไวยากรณ์
ไวยากรณ์ของคุณสมบัติขนาดแบบอักษร CSS มีดังต่อไปนี้ -
Selector {
font-size: /*value*/
} ตัวอย่าง
ตัวอย่างต่อไปนี้แสดงให้เห็นว่าคุณสมบัติขนาดแบบอักษร CSS ถูกตั้งค่าเป็นพิกเซล -
<!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> ผลลัพธ์
สิ่งนี้ให้ผลลัพธ์ต่อไปนี้ -
ตัวอย่าง
<!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> ผลลัพธ์
สิ่งนี้ให้ผลลัพธ์ต่อไปนี้ -
