จะปิดการตัดคำใน HTML ได้อย่างไร

ฉันรู้สึกโง่ที่ไม่สามารถคิดสิ่งนี้ แต่ฉันจะปิด wordwrap ได้อย่างไร word-wrapคุณสมบัติcss สามารถบังคับด้วยbreak-wordได้ แต่ไม่สามารถบังคับให้ปิดได้ (มีเพียงnormalค่าเดียวที่เหลืออยู่)

ฉันจะบังคับให้คำวิธีห่อปิด ?

คุณต้องใช้white-spaceแอตทริบิวต์CSS

โดยเฉพาะwhite-space: nowrapและwhite-space: preเป็นค่าที่ใช้กันมากที่สุด คนแรกดูเหมือนจะเป็นสิ่งที่คุณต้องการ

เพิ่มค่าเฉพาะของ webkit ที่หายไปจากด้านบน

white-space: -moz-pre-wrap; /* Firefox */
white-space: -o-pre-wrap; /* Opera */
white-space: pre-wrap; /* Chrome */
word-wrap: break-word; /* IE */

ฉันสงสัยว่าทำไมคุณถึงค้นหาวิธีแก้ปัญหา "white-space" กับ "nowrap" หรือ "pre" มันไม่ได้ทำพฤติกรรมที่ถูกต้อง: คุณบังคับข้อความของคุณในบรรทัดเดียว! ข้อความควรแบ่งบรรทัด แต่ไม่แบ่งคำเป็นค่าเริ่มต้น ปัญหานี้เกิดจากแอตทริบิวต์ css: word-wrap, overflow-wrap, word-break และยัติภังค์ ดังนั้นคุณสามารถมี:

word-break: break-all;
word-wrap: break-word;
overflow-wrap: break-word;
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;

ดังนั้นทางออกคือลบออกหรือแทนที่พวกเขาด้วย "unset" หรือ "Normal":

word-break: unset;
word-wrap: unset;
overflow-wrap: unset;
-webkit-hyphens: unset;
-moz-hyphens: unset;
-ms-hyphens: unset;
hyphens: unset;

อัปเดต: ฉันให้การพิสูจน์ด้วย JSfiddle: https://jsfiddle.net/azozp8rr/

สิ่งนี้ได้ผลสำหรับฉันที่จะหยุดการทำงานที่โง่เขลาจากสิ่งที่เกิดขึ้นใน Chrome

word-break: keep-all;