เลือกใช้การตัดข้อความที่เพิ่มประสิทธิภาพเพื่อความงามที่รวดเร็วกว่า
ใน Chrome 117 คุณจะใช้ฟีเจอร์การตัดข้อความแบบใหม่ได้text-wrap: pretty
จาก CSS Text ระดับ 4
p {
text-wrap: pretty;
}
แม่ม่ายและเด็กกำพร้าแบบตัวอักษรคือคำเดี่ยวๆ ที่โดดเดี่ยวท้ายย่อหน้าหรือบล็อกข้อความ แม่ม่ายคือคำที่อยู่ด้านบนของบล็อกข้อความ และเด็กกำพร้าอยู่โดดเดี่ยวในตอนท้ายของบล็อกข้อความ เพราะอาจรบกวนสายตาของการดูข้อความ ทำให้อ่านเนื้อหาได้ยากขึ้น นักออกแบบบางคนพยายามหลีกเลี่ยงค่าใช้จ่ายทั้งหมดและต้องใช้ความพยายามอย่างยิ่ง ในการป้องกันไม่ให้ออกแบบเอง
ตั้งแต่ Chrome 117 เป็นต้นไป คุณสามารถหลีกเลี่ยงเด็กกำพร้าได้โดยใช้ CSS เพียงบรรทัดเดียว: text-wrap: pretty
ฟีเจอร์นี้ไม่เพียงแค่ทำให้ย่อหน้าไม่ได้จบลงด้วยคำเดียว แต่ยังปรับเครื่องหมายขีดกลางหากบรรทัดขีดกลางติดกันปรากฏขึ้นท้ายย่อหน้าหรือปรับบรรทัดก่อนหน้าเพื่อให้มีที่ว่าง นอกจากนี้ยังปรับ
การให้เหตุผลกับข้อความอย่างเหมาะสมอีกด้วย โดยทั่วไปแล้ว text-wrap: pretty
มีไว้สำหรับการตัดบรรทัดและการแบ่งข้อความที่ดีกว่า ซึ่งปัจจุบันจะมุ่งเน้นไปที่เด็กกำพร้า
ในอนาคต text-wrap: pretty
อาจมีการปรับปรุงเพิ่มเติม
นอกจากนี้ ยังมี text-wrap: balance
ซึ่งไม่ป้องกันเด็กกำพร้า แต่ช่วยให้มั่นใจว่าข้อความจะตัดกันในลักษณะที่สร้างบล็อกข้อความที่ดูกลมกลืน โดยส่วนตัวแล้วฉันใช้ balance
สำหรับบรรทัดแรก และใช้ pretty
สำหรับย่อหน้า
หากสนใจรายละเอียดของอัลกอริทึมที่ใช้กำหนดจำนวนเส้นที่เหมาะสมที่สุดหรือข้อควรพิจารณาด้านประสิทธิภาพ นี่คือลิงก์ไปยังเอกสารการออกแบบที่สร้างโดยวิศวกรที่อยู่เบื้องหลังฟีเจอร์นี้ Koji Ishii
หากคุณมีคำแนะนำหรือการปรับปรุงเกี่ยวกับการแบ่งบรรทัดอื่นๆ เราอยากจะฟัง! รายงานปัญหาในเครื่องมือติดตามข้อบกพร่องของ Chromium โดยระบุรายละเอียด ตัวอย่างการขึ้นบรรทัดใหม่ที่ดีและไม่ดี แล้วเราจะติดต่อกลับหาคุณ