Ngắt dòng lực CSS
|
In this article, we will learn how to break a line of any statement using properties of CSS. You must know Show
Chúng tôi sử dụng thuộc tính từ – break trong < . Thuộc tính CSS that is used to specify how a word should be broken or split when reaching the end of a line. The từ – quấn là used to split/break long words and wrap them into the next line. The tràn – CSS bọc được áp dụng cho các phần tử nội tuyến & chỉ định rằng . .word {
width: 200px;
overflow-wrap: break-word;
word-wrap: break-word;
word-break: break-word;
}
Trong CSS này, chúng ta cần chỉ định chiều rộng từ nơi bắt đầu ngắt dòng. Trong đoạn mã trên, ngắt dòng sẽ bắt đầu sau khi đạt được chiều rộng 200px Thuộc tính CSS Ngắt văn bản bằng quy tắc ngắt dòng mặc định Ngắt văn bản bằng quy tắc ngắt dòng hạn chế nhất. Thường được sử dụng cho các dòng ngắn, chẳng hạn như trong báo chí Ngắt văn bản bằng quy tắc ngắt dòng phổ biến nhất Ngắt văn bản bằng quy tắc ngắt dòng nghiêm ngặt nhất Có một cơ hội bọc mềm xung quanh mọi đơn vị ký tự typographic, bao gồm xung quanh bất kỳ ký tự dấu chấm câu hoặc khoảng trắng được giữ nguyên hoặc ở giữa các từ, bỏ qua bất kỳ lệnh cấm nào đối với ngắt dòng, ngay cả những lệnh cấm do các ký tự có ký tự GL, WJ hoặc ZWJ tạo ra . Các cơ hội gói khác nhau không được ưu tiên. Dấu gạch nối không được áp dụng Giá trị ban đầu Để buộc ngắt dòng trong trường hợp một từ dài hoặc bất kỳ văn bản dài nào không có dấu cách, hãy sử dụng thuộc tính Thuộc tính CSS 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à line-break =1 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 line-break =1 là bí danh Thuộc tính cú pháp
giá trị
Bản trình diễn bên dưới có một nút chuyển đổi cho phép bạn chuyển đổi giữa Dự phòng nhúng CodePen Để chứng minh vấn đề mà Một chuỗi các ký tự khoảng cách không ngắt ( Điểm tương đồng với tài sản overflow-wrap = normal | break-word | anywhere 5
Sau khi mô tả các ví dụ về cách sử dụng Từ đó, chúng tôi có thể phỏng đoán rằng Tài sản lịch sử /* Keyword values */ line-break: auto; line-break: loose; line-break: normal; line-break: strict; line-break: anywhere; /* Global values */ line-break: inherit; line-break: initial; line-break: revert; line-break: revert-layer; line-break: unset; 84Cả hỗ trợ trình duyệtDữ liệu hỗ trợ trình duyệt này đến từ , có nhiều chi tiết hơn. Một số cho biết rằng trình duyệt hỗ trợ tính năng ở phiên bản đó trở lên |
