Tạo hiệu ứng tuyết rơi trang trí Noel tuyệt đẹp cho Blogspot
Xuất bản
Hello xin chào tất cả các bạn, chào mừng các bạn đã trở lại với blog Bác Sĩ Windows.
Tết Tây gần đến, Noel càng gần hơn, chỉ còn hơn 20 ngày nữa thôi là đến Noel rồi, vì vây nếu bạn muốn trang trí cho blog của bạn có thêm không khí noel thì hãy đọc và thực hiện theo bài viết này.
Bài viết này mình sẽ giới thiệu đến các bạn đoạn CSS và HTML tạo hiệu ứng tuyết rơi tuyệt đẹp cho Blogspot. Đây là hiệu ứng được tạo hoàn toàn từ CSS3, vì vậy sẽ không ảnh hưởng đến tốc độ trang web mà còn làm cho nó rất đẹp nữa!
Bước 2. Dán đoạn code này phía trên thẻ
Bước 3. Lưu mẫu.
Code được lấy từ blog cũ vì vậy mình không rõ code gốc nằm ở đâu, mình sẽ bổ sung sau.
Chúc các bạn thành công!
Tết Tây gần đến, Noel càng gần hơn, chỉ còn hơn 20 ngày nữa thôi là đến Noel rồi, vì vây nếu bạn muốn trang trí cho blog của bạn có thêm không khí noel thì hãy đọc và thực hiện theo bài viết này.
Bài viết này mình sẽ giới thiệu đến các bạn đoạn CSS và HTML tạo hiệu ứng tuyết rơi tuyệt đẹp cho Blogspot. Đây là hiệu ứng được tạo hoàn toàn từ CSS3, vì vậy sẽ không ảnh hưởng đến tốc độ trang web mà còn làm cho nó rất đẹp nữa!
Các bước thực hiện
Bước 1. Truy cập vào trang chỉnh sửa HTML của Blogspot.Bước 2. Dán đoạn code này phía trên thẻ
</body>
<style type="text/css"> .snow-container{position:fixed;width:100%;max-width:100%;z-index:99999;pointer-events:none;overflow:hidden;top:0;height:100%} .snow{display:block;position:absolute;z-index:2;top:0;right:0;bottom:0;left:0;pointer-events:none;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);-webkit-animation:snow linear infinite;animation:snow linear infinite} .snow.foreground{background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVa_NwqPS_tgCnd0ox1JpfmpH86kTUsOlqt9TenCROSMR1aGckhoV0h6Lry1NUybbUGv_6CDCYH7GF1Nu1SZbvmDTdHz2iO37MNMId-Uk9TTScnOCYS0SANbrScH3rccnCROMwLtxnSRsW/s1600/snow-effect-_---------BacSiWindows-Com.png ");-webkit-animation-duration:15s;animation-duration:10s} .snow.foreground.layered{-webkit-animation-delay:7.5s;animation-delay:7.5s} .snow.middleground{background-image:url(https://dl6rt3mwcjzxg.cloudfront.net/assets/snow/snow-medium-0b8a5e0732315b68e1f54185be7a1ad9.png);-webkit-animation-duration:20s;animation-duration:15s} .snow.middleground.layered{-webkit-animation-delay:10s;animation-delay:10s} .snow.background{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggpnnBwPZd3BxV8OUCNg-i72dqTCAyGiMq9w-YhatsYTEDDEwCYPNJwhA5OvsraflKFD0cp-26oqxVAUbLbP331q3qkVmqcJqbkjL2FAC_xYBv77PShyBRzyGyRu9QzHuKBqZq6P_COmLc/s1600/snow-effect_-_--------------BacSiWindows-Com.png);-webkit-animation-duration:25s;animation-duration:20s} .snow.background.layered{-webkit-animation-delay:12.5s;animation-delay:12.5s} @-webkit-keyframes snow{0%{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}100%{-webkit-transform:translate3d(5%,100%,0);transform:translate3d(5%,100%,0)}} @keyframes snow{0%{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}100%{-webkit-transform:translate3d(5%,100%,0);transform:translate3d(5%,100%,0)}} </style> <div class='snow-container'><div class='snow foreground'/><div class='snow foreground layered'/><div class='snow middleground'/><div class='snow middleground layered'/><div class='snow background'/><div class='snow background layered'/></div>
Bước 3. Lưu mẫu.
Tổng kết
Với một đoạn ngắn CSS và HTML, bạn đã có cho mình một hiệu ứng tuyết rơi vĩnh cửu, làm cho trang blog của bạn thêm đẹp hơn trong những ngày Noel sắp tới!Code được lấy từ blog cũ vì vậy mình không rõ code gốc nằm ở đâu, mình sẽ bổ sung sau.
Chúc các bạn thành công!
Đây là khu vực quản trị, bạn không có quyền truy cập vào!
Cướp cmt đầu!
Trả lờiXóaMà sao giống thế anh ?
Xóahttps://goo.gl/73mH9n
Chắc lấy code cùng một chỗ đó em
XóaChắc là zậy rồi. :v
XóaLag thế a
Trả lờiXóaTuyết rơi dày đặc thế kia phải lag rồi!
XóaChỉ demo trong bài viết này thôi, kệ đi :v
XóaChiều có bài viết nh
Trước khi nghỉ Tết phải bước qua thứ gọi là “kì thi học kì” :<
Trả lờiXóaCheck Ib em phát : FB.com/WhoAm1.info
Trả lờiXóaCó gì không vậy, không rep inbox riêng được.
XóaEm hỏi về cái GA ấy mà
XóaXùy, thì hỏi ở đây luôn có gì phải inbox riêng.
XóaEm không muốn nộ liễu anh ạ
Xóanộ liễu :v
XóaKhông biết sao nữa, ngoài home còn bấm được mà vô post nó liệt :v
Trả lờiXóaMình yêu nhau đi?
Trả lờiXóaGì đây SC :/
XóaTự nhiên muốn yêu Trường :v
XóaThôi đi, comment lên top chứ gì :v
XóaĐâu xitpe toàn nghĩ thế là sao -_- éo comment nữa lè.
XóaThôi nào thôi nào :vv
Xóahttps://media.tenor.co/images/aa440153baa6f34405ef831cbf58531c/tenor.gif
Không yêu trả dép bố về, ok ngồi đây lâu, nóng lắm rồi.
XóaƠ định mệnh có ai lấy dép bố đâu mà bố đòi :vv
XóaSửa lại cái BÀI VIẾT CÙNG CHUYÊN MỤC ở Mobile đi bác sĩ
Trả lờiXóaOk
XóaOk em
Trả lờiXóaNhận xét này đã bị quản trị viên blog xóa.
Trả lờiXóaThằng này nó rãnh nó đi spam comment này :v
XóaỦa cmt này mình xoá khi nào thế nhở!?
XóaXin code bông tuyết rơi BSW
Trả lờiXóaOke
XóaCông nhận mỗi lần nhảy vào bài này có tuyết nó lag thật
Trả lờiXóaĐấy lag thế bởi tui đâu có dám thêm vào blog.
XóaỦa mà Adsen ông đâu rồi?
XóaGA bán rồi ông.
XóaÔng hỏi dùm có ai mua GA ko tui có 2 cái nè!
XóaÔng vô mấy nhóm mua bán GA trên FB ý, nhiều lắm.
Xóacái GA mình chuyển đổi tài khoản đc mà phải ko?
XóaCái đó tui không biết, nhưng người ta mua GA toàn mua full mail gốc luôn thôi.
XóaBán là bán luôn cái tài khoản Google luôn ý.
Vậy ông bán cái GA sao Blog vẫn còn?
XóaTui reg GA bằng tài khoản khác ông ê không phải tài khoản tạo blog này.
XóaReg GA bằng tài khoản khác mà đặt lên Blog tài khoản khác nó vẫn hiện à?
XóaVẫn bình thường mà ông!
XóaÔi đệt tui lấy tui gắn lên Blog tui được kìa @@
XóaLạ nhờ, tui nghĩ gắn blog nào cũng hiện chứ, mã quảng cáo đâu liên quan gì đến tài khoản đăng ký.
XóaTui gắn khoảng 5p sau là hiện rồi.
Trước giờ tui đâu biết, chứ giờ Reg GA dễ ẹc à, đêm sáng ngày là có kết quả!
XóaĐã xài nó cho Học Bạn chấm vê nờ, haha (Hocban.vn) :v
Trả lờiXóahttps://screenshots.firefoxusercontent.com/images/d7b70a98-1f1f-420a-bc8b-caaced64a6b2.png
Điều, đẹp phết :v có không khí nô-en rầu :v
XóaNhanh vãi lại sắp lạnh sun vòi dồi :(
Trả lờiXóaFA không thích điều này =))
Xóa