Cách thiết lập vị trí dấu mục (list-item marker) với JavaScript

Thuộc tính listStylePosition (CSS list-style-position) xác định dấu mục (bullet/number) nằm bên trong (inside) hay bên ngoài (outside) hộp nội dung của mục danh sách.

Ví dụ minh họa

Nhấn nút để chuyển đổi vị trí dấu mục của danh sách thứ tự:

<!DOCTYPE html>
<html>
<body>
  <ol id="myID">
    <li>Một</li>
    <li>Hai</li>
  </ol>
  <button type="button" onclick="displayInside()">Dấu bên trong</button>
  <button type="button" onclick="displayOutside()">Dấu bên ngoài</button>
  <script>
    function displayInside() {
      document.getElementById("myID").style.listStylePosition = "inside";
    }
    function displayOutside() {
      document.getElementById("myID").style.listStylePosition = "outside";
    }
  </script>
</body>
</html>

So sánh inside vs outside