Tự động CSS dòng mới

Giá trị mặc định. bình thường được kế thừa. vângCó thể hoạt hình. KHÔNG. Đọc về animatableVersion. Cú pháp CSS3JavaScript. sự vật. phong cách. wordBreak="break-all" Thử đi


Hỗ trợ trình duyệt

Các số trong bảng chỉ định phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ thuộc tính

Thuộc tính word-break4. 05. 515. 03. 115. 0


Cú pháp CSS

phá vỡ từ. Bình thường. phá vỡ tất cả. giữ tất cả. ngắt lời. ban đầu. thừa kế;

Giá trị tài sản

Giá trịMô tảDemonormalGiá trị mặc định. Sử dụng quy tắc ngắt dòng mặc địnhbreak-allĐể tránh tràn, từ có thể bị ngắt ở bất kỳ ký tự nào Bản trình diễn ❯keep-all Không nên sử dụng ngắt từ cho văn bản tiếng Trung/Nhật/Hàn (CJK). Hành vi của văn bản không phải CJK giống như giá trị "bình thường"Bản trình diễn ❯ngắt từ Để tránh tràn, từ có thể bị ngắt tại các điểm tùy ý Bản trình diễn ❯initial Đặt thuộc tính này thành giá trị mặc định của nó. Đọc về khởi tạo Kế thừa thuộc tính này từ phần tử cha của nó. Đọc về thừa kế

Thuộc tính CSS overflow-wrap áp dụng cho các phần tử nội tuyến, đặt xem trình duyệt có nên chèn ngắt dòng trong một chuỗi không thể ngắt khác để ngăn văn bản tràn vào hộp dòng của nó hay không

Ghi chú. Ngược lại với word-break, overflow-wrap sẽ chỉ tạo ra một dấu ngắt nếu toàn bộ một từ không thể được đặt trên dòng của chính nó mà không bị tràn

Thuộc tính ban đầu là một tiện ích mở rộng không chuẩn và không có tiền tố của Microsoft có tên là word-wrap và được triển khai bởi hầu hết các trình duyệt có cùng tên. Kể từ đó, nó đã được đổi tên thành overflow-wrap, với word-wrap là bí danh

/* Keyword values */
overflow-wrap: normal;
overflow-wrap: break-word;
overflow-wrap: anywhere;

/* Global values */
overflow-wrap: inherit;
overflow-wrap: initial;
overflow-wrap: revert;
overflow-wrap: revert-layer;
overflow-wrap: unset;

Thuộc tính overflow-wrap được chỉ định là một từ khóa duy nhất được chọn từ danh sách các giá trị bên dưới

overflow-wrap = 
normal |
break-word |
anywhere

1

Các dòng chỉ có thể ngắt tại các điểm ngắt từ thông thường (chẳng hạn như khoảng cách giữa hai từ)

overflow-wrap = 
normal |
break-word |
anywhere

2

Để tránh bị tràn, một chuỗi ký tự không thể ngắt khác — như một từ dài hoặc URL — có thể bị ngắt tại bất kỳ điểm nào nếu không có điểm ngắt nào được chấp nhận trong dòng. Không có ký tự gạch nối nào được chèn vào điểm ngắt. Các cơ hội bọc mềm được giới thiệu bởi ngắt từ được xem xét khi tính kích thước nội tại nội dung tối thiểu

overflow-wrap = 
normal |
break-word |
anywhere

3

Giống như giá trị

overflow-wrap = 
normal |
break-word |
anywhere

2, với các từ không thể ngắt thông thường được phép ngắt tại các điểm tùy ý nếu không có điểm ngắt có thể chấp nhận được trong dòng, nhưng các cơ hội ngắt dòng mềm do ngắt từ KHÔNG được xem xét khi tính kích thước nội tại của nội dung tối thiểu

Giá trị ban đầu_______1_______1Áp dụng cho các phần tử nội tuyến không được thay thếKế thừaCác giá trị được tính toán như đã chỉ địnhKiểu hoạt hìnhrời rạc

overflow-wrap = 
normal |
break-word |
anywhere

Ví dụ này so sánh kết quả của overflow-wrap, word-break

overflow-wrap = 
normal |
break-word |
anywhere

8 khi chia nhỏ một từ dài