word-break

Các tiện ích để kiểm soát việc ngắt từ trong một phần tử.

ClassStyles
break-normal
word-break: normal;
break-all
word-break: break-all;
break-keep
word-break: keep-all;

Ví dụ

Bình thường

Sử dụng tiện ích break-normal để chỉ thêm ngắt dòng tại các điểm ngắt từ bình thường:

The longest word in any of the major English language dictionaries is pneumonoultramicroscopicsilicovolcanoconiosis, a word that refers to a lung disease contracted from the inhalation of very fine silica particles, specifically from a volcano; medically, it is the same as silicosis.

<p class="break-normal">The longest word in any of the major...</p>

Ngắt tất cả

Sử dụng tiện ích break-all để thêm ngắt dòng bất cứ khi nào cần thiết, mà không cố bảo toàn từ nguyên vẹn:

The longest word in any of the major English language dictionaries is pneumonoultramicroscopicsilicovolcanoconiosis, a word that refers to a lung disease contracted from the inhalation of very fine silica particles, specifically from a volcano; medically, it is the same as silicosis.

<p class="break-all">The longest word in any of the major...</p>

Giữ nguyên

Sử dụng tiện ích break-keep để ngăn chặn ngắt dòng khỏi việc được áp dụng cho văn bản Tiếng Trung/Nhật/Hàn (CJK):

抗衡不屈不挠 (kànghéng bùqū bùnáo) 这是一个长词,意思是不畏强暴,奋勇抗争,坚定不移,永不放弃。这个词通常用来描述那些在面对困难和挑战时坚持自己信念的人, 他们克服一切困难,不屈不挠地追求自己的目标。无论遇到多大的挑战,他们都能够坚持到底,不放弃,最终获得胜利。

<p class="break-keep">抗衡不屈不挠...</p>

Đối với văn bản không phải CJK, tiện ích break-keep có hành vi giống như tiện ích break-normal.

Responsive design

Prefix a word-break utility with a breakpoint variant like md: to only apply the utility at medium screen sizes and above:

<p class="break-normal md:break-all ...">  Lorem ipsum dolor sit amet...</p>

Learn more about using variants in the variants documentation.

Copyright © 2025 Tailwind Labs Inc.·Chính sách thương hiệu