Thuộc tính style.textIndent trong HTML DOM trả về và cho phép thay đổi thụt lề (indentation) của dòng đầu tiên của văn bản trong một phần tử trong tài liệu HTML.
Cú pháp
Lấy giá trị textIndent
object.style.textIndent
Thay đổi textIndent
object.style.textIndent = "value"
Các giá trị
Giá trị có thể là:
| Giá trị | Mô tả |
|---|---|
| inherit | Kế thừa giá trị từ phần tử cha. |
| initial | Đặt về giá trị mặc định. |
| percentage(%) | Thiết lập giá trị theo phần trăm chiều rộng phần tử cha. |
| length | Thiết lập giá trị theo đơn vị độ dài (px, em, rem, v.v.). |
Ví dụ
Ví dụ sử dụng thuộc tính style.textIndent:
<!DOCTYPE html>
<html>
<head>
<style>
body { color: #000; background: lightblue; height: 100vh; }
p { margin: 1.5rem auto; }
.btn { background: #db133a; border: none; height: 2rem; border-radius: 2px; width: 40%; display: block; color: #fff; outline: none; cursor: pointer; }
</style>
</head>
<body>
<h1>Ví dụ thuộc tính style textIndent DOM</h1>
<p> Đây là đoạn văn 1 với một số văn bản giả. Đây là đoạn văn 1 với một số văn bản giả. Đây là đoạn văn 1 với một số văn bản giả. Đây là đoạn văn 1 với một số văn bản giả. Đây là đoạn văn 1 với một số văn bản giả. Đây là đoạn văn 1 với một số văn bản giả. </p>
<button onclick="add()" class="btn">Thiết lập textIndent</button>
<script>
function add() {
document.querySelector('p').style.textIndent = "80px";
}
</script>
</body>
</html>
Kết quả
Nhấn nút Thiết lập textIndent để thay đổi thụt lề dòng đầu tiên của văn bản đoạn văn.