Thuộc tính writing-mode

Thuộc tính writing-mode thiết lập hướng văn bản dọc hoặc ngang trên trang. Các giá trị có thể là horizontal-tb (theo chiều ngang từ trái sang phải và từ trên xuống dưới), vertical-rl (theo chiều dọc từ trên xuống dưới và từ phải sang trái), vertical-lr (theo chiều dọc từ trên xuống dưới và từ trái sang phải).

Cú pháp

bộ chọn {
	writing-mode: horizontal-tb hoặc vertical-rl hoặc vertical-lr;
}

Ví dụ

Hãy thiết lập cho văn bản của chúng ta hướng theo chiều ngang từ trái sang phải và từ trên xuống dưới:

<p>
	Văn bản
</p>

body {
	width: 100px;
	height: 50px;
}
p {
	writing-mode: horizontal-tb;
	font-size: 2em;
	margin-top: 0;
}

Ví dụ

Bây giờ hãy thay đổi hướng theo chiều dọc từ trên xuống dưới và từ phải sang trái:

<p>
	Văn bản
</p>

body {
	width: 100px;
	height: 50px;
}
p {
	writing-mode: vertical-rl;
	font-size: 2em;
	margin-top: 0;
}

Ví dụ

Hãy thiết lập cho văn bản của chúng ta hướng theo chiều dọc từ trên xuống dưới và từ trái sang phải:

<p>
	Văn bản
</p>

body {
	width: 100px;
	height: 50px;
}
p {
	writing-mode: vertical-lr;
	font-size: 2em;
	margin-top: 0;
}

Xem thêm

thuộc tính font-kerning,
thiết lập kerning cho phông chữ
thuộc tính text-orientation,
thiết lập hướng của các ký tự trong văn bản dọc