Trong những lúc rảnh rỗi mình thường hay nghịch ngợm một vài thứ hay ho tìm thấy trên internet. Đối với CSS thì text-shadow cũng là thuộc tính khá hay để khám phá. Shadow có nghĩa là cái bóng. Text-shadow là đổ bóng cho văn bản. Nó cũng tương tự như với box-shadow.
Thuộc tính text-shadow trong CSS có cái gì để tìm hiểu? Hãy đọc ngay bài viết mà mình sắp chia sẻ sau đây.
Cách viết:
text-shadow: 2px 2px 5px blue;
Trong đó:
- 2px: là bóng đổ theo chiều ngang
- 2px: là bóng đổ theo chiều dọc
- 5px: là độ nhòe. Giá trị càng lớn độ nhòe càng nhiều
- blue: là màu của bóng. Bạn cũng có thể dùng mã màu HEX. Ví dụ: #3433ff
Ví dụ:
<!DOCTYPE html>
<html>
<head>
<title>Text Shadow</title>
<style>
h1 {
text-shadow: 2px 2px 5px blue;
}
</style>
</head>
<body>
<div class="content">
<h1>Bài tập về text-shadow</h1>
</div>
</body>
</html>
Kết luận: Qua bài học này bạn chỉ cần nhớ cách sử dụng các giá trị ở trên. Hãy thử tăng hay giảm số để chọn cho mình một text-shadow đẹp mắt trang trí blog, website lung linh hơn.
