Thuộc tính style marginLeft trong HTML DOM

Thuộc tính style.marginLeft trong HTML DOM trả về và cho phép thay đổi lề bên trái (left margin) của một phần tử trong tài liệu HTML.

Cú pháp

Lấy giá trị marginLeft

object.style.marginLeft

Thay đổi marginLeft

object.style.marginLeft = "value"

Ví dụ

Ví dụ sử dụng thuộc tính style.marginLeft:

<!DOCTYPE html>
<html>
<head>
<style>
  body { color: #000; background: lightblue; height: 100vh; }
  p { border: 2px solid #fff; }
  .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 marginLeft DOM</h1>
<p>Chào! Tôi là một đoạn văn tuyệt vời với một số văn bản ngẫu nhiên. Chào! Tôi là một đoạn văn tuyệt vời với một số văn bản ngẫu nhiên. Chào! Tôi là một đoạn văn tuyệt vời với một số văn bản ngẫu nhiên. Chào! Tôi là một đoạn văn tuyệt vời với một số văn bản ngẫu nhiên. </p>
<button onclick="add()" class="btn">Thêm margin</button>
<script>
  function add() {
    document.querySelector('p').style.marginLeft = "50px";
  }
</script>
</body>
</html>

Kết quả

Nhấn nút Thêm margin để thêm lề bên trái cho phần tử đoạn văn.