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>

text-shadow

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.

Cùng chủ đề

Category:
Tags:

Bình luận!

Xin lưu ý rằng tất cả các bình luận đều được kiểm duyệt theo chính sách bảo mật và tất cả các liên kết đều là nofollow. KHÔNG sử dụng từ khóa trong trường tên. Hãy để lại một cuộc trò chuyện cá nhân và ý nghĩa. *