Tạo Toggle Switch đẹp mắt với MoreToggles.CSS

 MoreToggles.css là thư viện css giúp bạn tạo toggle switch button đẹp mắt, với ưu điểm là chỉ sử dụng CSS mà không cần javascript, hỗ trợ nhiều kiểu hiển thị khác nhau, hoạt động tốt trên mọi độ phân giải màn hình.

Tạo Toggle Switch đẹp mắt với MoreToggles.CSS

Tạo Toggle Switch đẹp mắt với MoreToggles.CSS


* Cách tích hợp lên website

- Tải về source code, giải nén

- Chèn link đến file moretoggles.min.css trong thẻ <head>

<head>

  <link rel="stylesheet" href="moretoggles.min.css">

  // Thay đổi đường link đến file moretoggles.min.css theo source code của bạn.

</head>

* Cách sử dụng

- Mở file index.html (moretoggles\docs) để chọn style cho các toggle switch button;

- Cấu trúc HTML cho phần Toggle Switch như sau:

  <input id="1" type="checkbox" />

  <label for="1"></label>

Bạn chỉ cần copy class CSS đã chọn ở file index.html (moretoggles\docs) dán vào trong thẻ <div class=""></div>

Ví dụ:

 <div class="mt-ios-red">

   <input id="1" type="checkbox" />

  <label for="1"></label>

 </div>


Nếu bạn thấy nội dung trên blog hữu ích vui lòng chia sẻ bài viết hoặc mời BlogITCode một ly cà phê nhé!

Mới hơn Cũ hơn
Đọc tiếp: