Giới thiệu
Thuộc tính fontWeight trong HTML DOM Style dùng để thiết lập hoặc lấy độ dày (trọng lượng) của ký tự văn bản cho một phần tử.
Cú pháp
Thiết lập fontWeight:
object.style.fontWeight = "normal|lighter|bold|bolder|value|initial|inherit"
Giá trị
| Giá trị | Mô tả |
|---|---|
| normal | Mặc định, không thay đổi độ dày font (tương đương 400). |
| lighter | Font mỏng hơn so với phần tử cha. |
| bold | Font đậm (tương đương 700). |
| bolder | Font đậm hơn so với phần tử cha. |
| 100 - 900 | Các giá trị số từ 100 (mỏng nhất) đến 900 (đậm nhất). Normal=400, Bold=700. |
| initial | Đặt về giá trị mặc định. |
| inherit | Kế thừa từ phần tử cha. |
Ví dụ
Ví dụ thay đổi font-weight của hai đoạn văn bản thành bold.
<!DOCTYPE html> <html> <head> <style>
#demo2, #demo1 {
font-family: 'times new roman';
font-size: 25px;
}
</style> <script>
function changeFontWeight() {
document.getElementById("demo1").style.fontWeight = "bold";
document.getElementById("demo2").style.fontWeight = "bold";
document.getElementById("Sample").innerHTML = "Độ dày font đã thay đổi cho các đoạn văn trên";
}
</script> </head> <body>
<div id="demo1">This is demo text</div>
<div id="demo2">This is demo text</div>
<p>Nhấn nút để thay đổi font weight cho văn bản trong div</p>
<button onclick="changeFontWeight()">Thay đổi Font Weight</button>
<p id="Sample"></p>
</body> </html>
Kết quả
Sau khi nhấn nút Thay đổi Font Weight:
