Trang trí Tết cho website với câu đối và hoa mai đào khá độc đáo

8
314

Chào các bạn,

Chỉ còn một vài ngày nữa là chúng ta đón tết Mậu Tuất 2018.

Hòa chung niềm vui cùng U23 Việt Nam, không khí Tết đã tràn ngập phố phường, mỗi chúng ta cũng bắt đầu cảm thấy rộn ràng để chờ đón một năm mới an lành.

Ngay lúc này đây nếu bạn muốn mang không khí ấy lên blog thì bài viết này sẽ dành cho bạn.

Trong bài viết này, Tự Học MMO sẽ hướng dẫn bạn cách trang trí tết cho website bằng cách thêm câu đối và hoa mai, hoa đào.

Code trang trí Tết gồm có:

  • 2 banner trang trí 2 bên left, right của website.
  • 1 banner ở dưới bottom website.

Đây là code rất đơn giản, chỉ gồm một vài dòng HTML và CSS nên bạn có thể dễ dàng tùy biến để phù hợp cho website.

Bạn cũng có thể dễ dàng thay hình ảnh của 2 câu đối bằng các hình ảnh khác cũng được.

Cách thực hiện: 

Bạn copy đoạn code dưới đây:

Mẫu 1:

code trang trí tết cho website wordpress

  • Đối với Website thông thường: đặt code dưới thẻ <body> trong Website của bạn
  • Đối với WordPress: đặt code dưới thẻ <head> nằm trong file header.php
  • Đối với Blogger: chọn Menu →Bố cục→Thêm tiện ích HTML/Javascript
Mẫu 2:

code trang trí tết cho website wordpress

Tuy nhiên, code này chưa responsive với giao diện điện thoại hoặc tablet, nên mình rất mong bạn nào cao thủ hướng dẫn nhé  laugh

Bạn có thể chèn thêm các câu đối tết, lời chúc năm mới hoặc một vài cành hoa đào, mai, bánh chưng… vào trang web của bạn.

Nên đặt ảnh ở 2 bên lề hoặc phía dưới trang web, tránh sử dụng quá nhiều chi tiết trang trí khiến trang web chạy chậm và trông rối mắt.

Nếu bạn thấy thích bài viết vui lòng chia sẻ nó đến những người khác giúp mình.

Chúc bạn và gia đình một năm mới An Khang – Thịnh Vượng.

Trang trí Tết cho website với câu đối và hoa mai đào khá độc đáo
5 (100%) 5 votes
bột kem làm trắng răng

Tham gia bình luận

Please enter your comment!
Vui lòng điền tên của bạn

8 bình luận

  1. Cần cao thủ cho nó ẩn trên điện thoại hoặc làm sao đó, chứ cái này trên website thì ok, điện thoại thì out

    • Bạn khai báo 2 thuộc tính class banner_right và banner_left rồi thêm code này vào css để ẩn trên giao diện điện thoại đi nhé: smile
      @media only screen and (max-width: 1024px) {
      .banner_left img, .banner_right img {
      display: none;
      }
      }

  2. Bác ơi muốn để độc hoa đào bên trên làm sao nhỉ ? site em neesy hiện hết cho bị che mấy 2 bên.

    • nghĩa là sao Thành ! mình thấy hiện bình thường mà, cái hoa đào đấy là ảnh banner ! cậu tìm banner nào nhỏ gọn thay link tương ứng vào code là được