Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> HTML

Thuộc tính wordBreak của HTML DOM Style


Thuộc tính wordBreak quy định quy tắc ngắt dòng cho các chữ không phải CJK (Trung, Nhật, Hàn).

Cú pháp

object.style.wordBreak = "value"

Giá trị

Giá trịMô tả
initialMặc định.
inheritKế thừa.
normalNgắt theo quy tắc thông thường.
keep-allKhông ngắt giữa cặp chữ cái (dành cho CJK).
break-allCho phép ngắt giữa bất kỳ hai chữ cái nào.

Ví dụ: Ngắt từ dài không có khoảng trắng

<!DOCTYPE html>
<html>
<head>
  <style>
    p { border: 2px solid #fff; width: 120px; }
    .btn { background: #db133a; color: #fff; border: none; padding: 0.5rem 1rem; cursor: pointer; }
  </style>
</head>
<body>
  <h1>DOM Style wordBreak Property</h1>
  <p>Thisisaparagraphelement.</p>
  <button onclick="add()" class="btn">Set wordBreak</button>
  <script>
    function add() {
      document.querySelector('p').style.wordBreak = "break-all";
    }
  </script>
</body>
</html>

Văn bản không có khoảng trắng sẽ bị ngắt dòng tại bất kỳ vị trí nào khi bật break-all.