Text-indent trong css? Tại sao chúng ta cần hiểu thuộc tính text-indent?

Text-indent trong css là một trong những keyword được search nhiều nhất trên Google về chủ đề text-indent trong css. Trong bài viết này, xaydungweb.vn sẽ viết bài viết Text-indent trong css? Tại sao chúng ta cần hiểu thuộc tính text-indent?

Xem thêm: Tổng hợp cách chèn link vào button trong html mới nhất 2020

Text-indent trong css? Tại sao chúng ta cần hiểu thuộc tính text-indent?

khái niệm và dùng

tính chất text-indent ghi rõ thụt đầu loại của thể loại trước tiên trong một khối văn bản.

Cấu trúc

tag {
    text-indent: giá trị;
}

Với trị giá giống như sau:

thuộc tính	giá trị	gợi ý	giới thiệu
text-indent	đơn vị	text-indent: 10px;	Khoảng cách xuất hiện ở dòng đầu, tổ chức đủ nội lực là px, em, %, …
text-indent	inherit	text-indent: inherit;	xác định thừa hưởng thuộc tính từ yếu tố cha (thành phần bao ngoài).

ví dụ

HTML viết:

<html>
<head></head>
<body>
<p>Đây là dòng đầu có sử dụng text-indent, có hiệu ứng đối với dòng đầu tiên trong văn bản, khác với padding có hiệu ứng đối với toàn bộ văn bản.</p>
</body>
</html>

Hiển thị trình duyệt khi chưa có CSS:

Đây là thể loại đầu có dùng text-indent, có hiệu ứng so với loại đầu tiên trong văn bản, không giống với padding có hiệu ứng đối với toàn bộ văn bản.

CSS viết:

p {
    text-indent: 30px;
}

Hiển thị trình duyệt khi có CSS:

Đây là thể loại đầu có sử dụng text-indent, có hiệu ứng đối với loại đầu tiên trong văn bản, không giống với padding có hiệu ứng so với all văn bản.