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

Thuộc tính lineHeight của DOM Style trong HTML


Giới thiệu

Thuộc tính lineHeight của DOM Style (tương ứng CSS line-height) thiết lập khoảng cách giữa các dòng văn bản (chiều cao dòng).

Cú pháp

// Lấy
object.style.lineHeight
// Gán
object.style.lineHeight = "normal|so|don_vi|%|initial|inherit"
  • normal: Chiều cao dòng mặc định (~1.2).
  • số: Hệ số nhân với font-size (ví dụ: 1.5, 2).
  • đơn vị: px, em, rem, pt...
  • %: Phần trăm font-size.
  • initial/inherit: Trả về mặc định/kéo thừa.

Ví dụ minh họa

<!DOCTYPE html>
<html>
<body>
  <h2>Tiêu đề Demo</h2>
  <div id="myid">
    Đây là văn bản demo dài. Đây là văn bản demo dài. Đây là văn bản demo dài.
    Đây là văn bản demo dài. Đây là văn bản demo dài. Đây là văn bản demo dài.
  </div>
  <br>
  <button type="button" onclick="display()">Tăng chiều cao dòng</button>
  <script>
    function display() {
      document.getElementById("myid").style.lineHeight = "3";
    }
  </script>
</body>
</html>

Kết quả hiển thị

Ban đầu dòng cách nhau bình thường. Sau khi nhấn nút, giãn dòng gấp 3 lần font-size.