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.