Đối với kích thước văn bản có thể mở rộng, kích thước phông chữ được biểu thị bằng em. Mặc định một em bằng 16px hoặc 12pt. Giá trị của nó có liên quan đến kích thước phông chữ của phần tử mẹ.
Cú pháp
Cú pháp của thuộc tính font-size CSS như sau -
Selector { font-size: /*value*/ }
Ví dụ
Các ví dụ sau minh họa cách có thể đặt thuộc tính CSS font-size trong ems -
<!DOCTYPE html> <html> <head> <style> div { width: 40%; border: 2px solid yellow; padding: 20px; font-size: 1em; } span { font-size: 2em; background-color: chartreuse; } </style> </head> <body> <div> <p>This is a demo paragraph<span> displaying font sizes</span> set with em in CSS.</p> </div> </body> </html>
Đầu ra
Điều này cho kết quả sau -
Ví dụ
<!DOCTYPE html> <html> <head> <style> table { width: 40%; border: 2px ridge red; font-size: 0.8em; } span { font-size: 1.5em; background-color: silver; } </style> </head> <body> <h2>Class Info</h2> <table> <tr> <th>Number of Students</th> </tr> <tr> <td>Class A</td> <td><span>50 Students</span></td> </tr> <tr> <td>Class B</td> <td><span>40 Students</span></td> </tr> </table> </body> </html>
Đầu ra
Điều này cho kết quả sau -