คุณสมบัติ text-align

คุณสมบัติ text-align กำหนด การจัดแนวข้อความ: ชิดซ้าย, ชิดขวา, กึ่งกลาง, ชิดขอบทั้งซ้ายและขวาพร้อมกัน (justify)

ไวยากรณ์

selector {
	text-align: center | left | right | justify | auto | start | end;
}

ค่าต่างๆ

ค่า	คำอธิบาย
`center`	ข้อความจะถูกจัดให้อยู่กึ่งกลาง
`left`	ข้อความจะถูกจัดชิดซ้าย
`right`	ข้อความจะถูกจัดชิดขวา
`justify`	ข้อความจะถูกจัดชิดขอบทั้งซ้ายและขวาพร้อมกัน
`auto`	ไม่เปลี่ยนการจัดแนวขององค์ประกอบ (ค่าเริ่มต้น)
`start`	เท่ากับ `left` หากข้อความไหลจากซ้ายไปขวา และเท่ากับ `right` เมื่อข้อความไหลจากขวาไปซ้าย (เช่น ภาษาอาหรับ)
`end`	เท่ากับ `right` หากข้อความไหลจากซ้ายไปขวา และเท่ากับ `left` เมื่อข้อความไหลจากขวาไปซ้าย

ค่าเริ่มต้น: auto ในกรณีส่วนใหญ่ โดยค่าเริ่มต้นข้อความจะถูกจัด ชิดซ้าย (ในภาษาอาหรับ - ชิดขวา) อย่างไรก็ตาม มีข้อยกเว้น เช่น ข้อความ ใน th จะถูกจัดกึ่งกลาง

ตัวอย่าง . ค่า left

<p>
	some long text
</p>

p {
	text-align: left;
	width: 400px;
}

ตัวอย่าง . ค่า right

<p>
	some long text
</p>

p {
	text-align: right;
	width: 400px;
}

ตัวอย่าง . ค่า center

<p>
	Lorem ipsum dolor sit amet.
</p>

p {
	text-align: center;
}

ตัวอย่าง . ค่า justify

<p>
	some long text
</p>

p {
	text-align: justify;
	width: 400px;
}