Lựa chọn sử dụng tính năng xuống dòng tối ưu hoá văn bản để đẹp hơn tốc độ.
Từ Chrome 117, bạn có thể sử dụng tính năng xuống dòng tự động mới: text-wrap: pretty
trong CSS Text Level 4 (Văn bản CSS 4).
p {
text-wrap: pretty;
}
Góa phụ và trẻ mồ côi trong kiểu chữ có hình ảnh độc thân các từ đứng riêng lẻ ở cuối đoạn văn hoặc khối văn bản. Goá chồng là từ một mình ở đầu khối văn bản còn trẻ mồ côi thì nằm một mình ở cuối văn bản chặn. Chúng có thể làm gián đoạn cách mắt chúng ta đọc lướt văn bản, khiến nội dung khó đọc hơn để đọc. Một số nhà thiết kế tránh sử dụng những quảng cáo này bằng mọi giá và nỗ lực rất nhiều để ngăn chặn chúng.
Từ Chrome 117, bạn có thể tránh trẻ mồ côi bằng một dòng CSS: text-wrap: pretty.
Tính năng này không chỉ đảm bảo các đoạn văn bản không kết thúc bằng
từ đơn lẻ, công cụ này cũng điều chỉnh dấu gạch nối nếu các dòng liên tiếp xuất hiện
ở cuối đoạn hoặc điều chỉnh các dòng trước để tạo chỗ trống. Việc này cũng sẽ
điều chỉnh cho phù hợp với lý do của văn bản. text-wrap: pretty dành cho
thường tốt hơn xuống dòng tự động và ngắt văn bản, hiện tập trung vào trẻ mồ côi.
Trong tương lai, text-wrap: pretty có thể cung cấp nhiều cải tiến hơn.
Ngoài ra còn có text-wrap: balance, không
ngăn trẻ em mất tích, nhưng đảm bảo rằng văn bản được gói theo cách tạo ra
khối văn bản hài hoà. Cá nhân tôi sử dụng balance cho dòng tiêu đề và pretty cho
đoạn văn bản.
Nếu bạn muốn biết thông tin chi tiết về thuật toán được sử dụng để xác định số lượng dòng tối ưu hoặc các cân nhắc về hiệu suất, đây là đường liên kết đến tài liệu thiết kế do kỹ sư này tạo đằng sau tính năng này, Koji Ishii.
Nếu bạn có đề xuất hoặc cải tiến khác về việc ngắt dòng, vui lòng cho chúng tôi biết họ! Báo cáo một vấn đề trong trình theo dõi lỗi Chromium kèm theo thông tin chi tiết, ví dụ về ngắt dòng đúng và không hợp lệ, chúng tôi sẽ liên hệ lại với bạn.