Quảng cáo bằng văn bản với hiệu ứng tuyệt vời

Hình ảnh minh họa

Tiện ích này được tạo ra hoàn toàn từ CSS và không sử dụng hình ảnh hoặc Javascript. bạn chỉ cần rê chuột vào chữ bạn sẽ thấy hiệu ứng tuyệt vời của nó.

Demo

⇝WapGiaLai Blog
Wapgialai .Blogspot.Com⇜

Hướng dẫn thêm tiện ích

Để làm được điều này các bạn hãy xem hướng dẫn thêm tiện ích quảng cáo bằng văn bản với hiệu ứng tuyệt vời dưới đây
Bước 1: Vào bảng điều khiển Blogger -> Bố cục (Layout) -> Thêm tiện ích (Add a Widget) -> HTML/Javascript
Bước 2: Dán code dưới đây vào tiện ích vừa thêm

<style>
#text{-moz-transform:rotate(-5deg);-o-transform:rotate(-5deg);-webkit-transform:rotate(-5deg);color:#FFF!important;font-family:arial;font-size:60px;font-weight:300;letter-spacing:-5.5px;line-height:45px;text-align:center;margin:20px 10px}
#text a{color:#333;text-shadow:1px 1px #000, 3px 3px #EEEEEE, 5px 5px #DDDDDD, 7px 7px #AAAAAA, -1px -1px #000;text-transform:lowercase;-moz-transition:all .3s ease-in 0;-webkit-transition:all .3s ease-in 0;-o-transition:all .3s ease-in 0;-kmoz-transition:all .3s ease-in 0}
#text a:hover{-moz-transition:all .3s ease-in 0;-webkit-transition:all .3s ease-in 0;-o-transition:all .3s ease-in 0;-kmoz-transition:all .3s ease-in 0;text-shadow:1px 1px #000, 3px 3px #EEEEEE, 5px 5px #DDDDDD, 7px 100px transparent, -1px -100px transparent;color:transparent}
inf{color:#d2a}
#text a:focus,#text a:active{color:#eee!important;-moz-transition:all 0 ease-in-out!important;-o-transition:all 0 ease-in-out!important;-kmoz-transition:all 0 ease-in-out!important;-webkit-transition:all 0 ease-in-out!important}
</style>
<div id="text" class="rent"><a href="http://wapgialai.blogspot.com/" target="blank"><blink>⇝</blink>WapGiaLai Blog<br /> Wapgialai<inf> .Blogspot.Com</inf><blink>⇜</blink></a></div>

Nguồn: itviet360.com