Khái niệm

text-shadow là một thuộc tính trong CSS cho phép bạn thêm hiệu ứng đổ bóng vào văn bản.

text-shadow có 4 thuộc tính (từ trái sang phải) :

• Vị trí trục theo chiều dọc
• Vị trí theo chiều ngang
• Độ nhoè của bóng
• Màu sắc

Cách sử dụng

Ví dụ

HTML

<h1>Hello</h1>

CSS

h1 {
  text-shadow: 2px 2px 4px #000000;
}

Kết quả:

Trong ví dụ này, chúng ta áp dụng đổ bóng vào phần tử <h1> với giá trị 2px cho độ lệch ngang và độ lệch dọc, 4px cho mờ của đổ bóng và #000000 cho màu sắc (màu đen). Bạn có thể tùy chỉnh các giá trị này để tạo ra các hiệu ứng khác nhau.

Trải nghiệm