Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> JavaScript

Cách thiết lập độ đậm của font (font-weight) với JavaScript

Thuộc tính fontWeight (CSS font-weight) kiểm soát độ đậm của chữ. Giá trị từ khóa: normal (400), bold (700), bolder, lighter. Giá trị số: 100–900 (bước 100).

Ví dụ minh họa

Nhấn nút để đặt font family và độ đậm 800 cho đoạn văn:

<!DOCTYPE html>
<html>
<body>
  <h1>Tiêu đề 1</h1>
  <p id="myID">Đây là văn bản demo.</p>
  <button type="button" onclick="display()">Đặt Font Family và Font Weight</button>
  <script>
    function display() {
      document.getElementById("myID").style.fontFamily = "verdana,sans-serif";
      document.getElementById("myID").style.fontWeight = "800";
    }
  </script>
</body>
</html>

Bảng trọng số font-weight

SốTừ khóaTên thường gọi
100Thin (Mỏng)
200Extra Light
300Light
400normalRegular
500Medium
600Semi Bold
700boldBold
800Extra Bold
900Black (Heavy)

Lưu ý: Font phải có sẵn trọng số tương ứng (variable font hoặc nhiều file font).