Tạo hiệu ứng chạy qua lại cho logo bằng css |
Chỉ với đoạn css này thì bạn có thể tạo được hiệu ứng rồi.Demo logo blog của mình luôn nhé!
Thêm đoạn css dưới đây lên ]]></b:skin> là xong :
/* Effect Logo */ #main-logo a{position:relative} #main-logo a:before,#main-logo a:after{content:"";position:absolute;bottom: 50%;top:50%;width:10px;height:100%;transform:translateY(-50%);background-color:rgb(4, 85, 133);z-index:999999999} #main-logo a:before{left:-5%;animation:light-left 3s infinite alternate linear} #main-logo a:after{right:-5%;animation:light-right 3s infinite alternate linear} @keyframes light-left{0%{left:-5%;opacity:0}50%{left:50%;opacity:1}100%{left:105%;opacity:0}} @keyframes light-right{0%{right:-5%;opacity:0}50%{right:50%;opacity:1}100%{right:105%;opacity:0}}
Lưu Ý:
Bạn nhớ thay #main-logo
thành thẻ css logo của bạn nhé!
Thủ thuật này khá đơn giản và chắc chẳng cần phải chúc thanh công đâu nhỉ !
Created by Voz Blogger
Một số lưu ý khi bình luận
Không đăng bình luận có nội dung khiêu dâm, 18+
Không đăng bình luận có liên quan đến chính trị, nhà nước.
Không đăng bình luận có nội dung phản động, kích động chiến tranh, thù địch.
Không đăng bình luận có nội dung phản cảm, bêu rếu, nói xấu.
Không đăng bình luận có nội dung tục tiểu, bậy bạ hay thậm chí "vô học".
Không đăng bình luận có liên kết spam, dẫn đến những trang có nội dung xấu.
Được đăng bình luận có mang tính đóng góp, xây dựng bài viết / blog.
Được đăng bình luận có liên quan đến nội dung bài viết.
Có thể góp ý, hay báo lỗi bài viết (thiếu ý, sai chính tả hay thiếu hình ảnh minh họa).
Post a Comment