Thuộc tính DOM Style letterSpacing trong HTML được sử dụng để thiết lập hoặc lấy khoảng cách giữa các ký tự giữa văn bản.
Sau đây là cú pháp cho -
Đặt thuộc tính letterSpacing -
object.style.letterSpacing = "normal|length|initial|inherit"
Các thuộc tính trên được giải thích như sau -
| Giá trị | Mô tả |
|---|---|
| bình thường | Đây là thuộc tính mặc định và đặt không gian ký tự thành bình thường. |
| chiều dài | Cũng cho phép xác định sai không gian ký tự theo đơn vị độ dài và giá trị âm. |
| tên ban đầu | Đang xác nhận thuộc tính này về giá trị ban đầu. |
| kế thừa | Kế thừa giá trị thuộc tính mẹ |
Chúng ta hãy xem một ví dụ cho thuộc tính letterSpacing:
Ví dụ
<!DOCTYPE html>
<html>
<head>
<script>
function changeSpacing() {
document.getElementById("myP").style.letterSpacing = "12px";
document.getElementById("Sample").innerHTML = "The space between characters is now increased";
}
</script>
</head>
<body>
<p id="myP">This is some text inside the sample paragraph. This is another line in paragraph. This is second line in paragraph. This is third line in paragraph. </p>
<p>Increase the space between characters in the above paragraph by clicking the below button</p>
<button type="button" onclick="changeSpacing()">Increase Letter Spacing</button>
<p id="Sample"></p>
</body>
</html> Đầu ra
Khi nhấp vào nút “ Tăng khoảng cách chữ cái Nút ”-