คุณสมบัติ text-justify ใน CSS ใช้สำหรับกำหนดวิธีการจัดข้อความให้กว้างเต็ม (justification) เมื่อคุณสมบัติ text-align ถูกตั้งค่าเป็น justify ค่าที่ใช้ได้มีดังนี้:
text-justify: auto | inter-word | inter-character | none | initial | inherit;
ตัวอย่าง: ใช้ inter-word
<!DOCTYPE html> <html> <head> <style> div { text-align: justify; text-justify: inter-word; color: white; background-color: gray; } </style> </head> <body> <h2>Demo Heading</h2> <div>This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. This is demo text. </div> </body> </html>
ผลลัพธ์
ปรับขนาดเบราว์เซอร์เพื่อดูการเปลี่ยนแปลง:
คำอธิบายค่าแต่ละตัว
- auto - เบราว์เซอร์ตัดสินใจเอง (ค่าเริ่มต้น)
- inter-word - เพิ่มช่องว่างระหว่างคำ (เหมาะสำหรับภาษาอังกฤษ)
- inter-character - เพิ่มช่องว่างระหว่างตัวอักษร (เหมาะสำหรับภาษาเอเชีย เช่น ไทย, จีน, ญี่ปุ่น)
- none - ปิดการจัดข้อความให้กว้างเต็ม
หมายเหตุ: สำหรับภาษาไทยแนะนำให้ใช้ inter-character เพราะภาษาไทยไม่มีช่องว่างระหว่างคำ
