Khoảng cách dòng trong CSS

Bây giờ hãy học cách đặt khoảng cách dòng cho văn bản. Khoảng cách dòng được hiểu là khoảng cách giữa các dòng văn bản, tức là khoảng trắng giữa chúng. Thuộc tính line-height được dùng cho việc này, nó xác định chiều cao của dòng văn bản.

Khi sử dụng thuộc tính line-height, bạn có thể gặp một điều bất ngờ: thuộc tính này không đặt khoảng cách giữa các dòng văn bản như có thể tưởng tượng, mà nó đặt chiều cao của dòng văn bản.

Điều này có nghĩa là khoảng cách nhìn thấy thực tế giữa các dòng sẽ được tính như sau: line-height - font-size = khoảng cách nhìn thấy giữa các dòng văn bản.

Trong ví dụ tiếp theo, khoảng cách giữa các dòng văn bản sẽ là 50px - 20px = 30px:

<p>
	some long text
</p>

p {
	font-size: 20px;
	line-height: 50px;
	text-align: justify;
	width: 400px;
}

Giả sử cỡ chữ cho các đoạn văn là 30px. Hãy đặt thuộc tính line-height sao cho khoảng trắng nhìn thấy được giữa các đoạn văn bằng 15px.