Làm mờ chữ với CSS3
Nếu đã nghiên cứu CSS3 bạn sẽ thấy không có thuộc tính nào giúp làm mờ chữ. Nhưng chỉ cần kết hợp 2 thuộc tính text-shadow và color là bạn đã có thể giải quyết được vấn đề này
Và đây là đoạn mã CSS cần thiết:
.textblur {
color: transparent;
text-shadow: 0 0 20px rgba(0,0,0,0.5);
}
Trong demo, mình sử dụng hiệu ứng khi hover qua thì chữ sẽ hết bị mờ, và kèm theo hiệu ứng transition, mã CSS như sau:
.textblur {
color: transparent;
text-shadow: 0 0 20px rgba(0,0,0,0.5);
text-align: center;
height: 120px;
line-height: 60px;
font-size: 40px;
-webkit-transition: text-shadow 1.9s;
-moz-transition: text-shadow 1.9s;
}
.textblur:hover {
text-shadow: 0 0 0 rgba(0,0,0,1);
-webkit-transition: text-shadow 0.5s;
-moz-transition: text-shadow 0.5s;
}

. Hiện mình đang sống tại Hà Nội. Sở thích: làm website và giúp đỡ mọi người phát triển website theo chiều hướng tốt đẹp hơn.