Custom checkbox & radio từ A - Á!

Intro khởi tạo checkbox radio và những kinh nghiệm cần chú ý

Series chia sẻ việc các bạn có thể tùy chỉnh lại style cho radio và checkbox phù họp với giao diện website cũng như là phụ hợp với tất cả các hệ điều hành khác nhau.

Ngoài ra trong series cũng chia sẻ có bao nhiêu cách để tùy chỉnh style cho radio và checkbox ví dụ như bằng CSS, CSS + IMG, CSS + FONT .v.v....

Cũng như trong series còn chia sẻ việc tùy chỉnh lại radio và checkbox cho thư viện bootstrap.

Mình không copy soure code vào đây để các bạn có thể tự viết nhá.

01 Khởi tạo html checkbox và radio

Ở video này chúng ta sẽ bắt đầu tìm hiểu và khởi tạo html radio và checkbox, các thuộc tính checked disable của radio và checkbox

02 Các giá trị liên quan checkbox và radio

Ở video này chúng ta sẽ tìm hiểu các giá trị cần thiết của checkbox&radio cũng như là ý nghĩa của nó.

03 Tùy chỉnh html:CSS thay thế Checkbox mặc định

Ở video này chúng ta bắt đầu tùy chỉnh checkbox và radio mặc định bằng CSS

04 Tùy chỉnh CSS để có Hover và :checked của input[type="checkbox"]

Ở video này chúng ta sẽ tiến hành tùy chỉnh vào Hover cũng như là :checked của input checkbox

05 Tùy chỉnh thuộc tính Checked cũng như Disable của Checkbox

Ở video này chúng ta sẽ đi vào việc tùy chỉnh :checked cũng như :disabled của input.

06 Tùy chỉnh CSS cho Radio

Video giúp tùy chỉnh thuộc tính mặc định của radio bằng CSS các thuộc tính hover checked disabled

07 Custom Css Checkbox & Radio

Ở video này giúp cho chúng ta giảm thiểu những CSS dư thừa mà chúng ta đã viết cho cùng 1 chức năng

08 P1 Tạo Checkbox & Radio bằng kỹ thuật Sprite

Link down ảnh: http://i.imgur.com/PIjBaZK.png
Ở video này sẽ giúp chúng ta tiếp cận với kỹ thuật Sprite giúp cải thiện tốc độ load website cũng như khá dễ dàng sử dụng css để làm việc với hình ảnh sprite

09 Tạo Checkbox và Radio bằng Fontawesome

Ở video này chúng ta sẽ tiến hành việc custom checkbox và radio bằng cách sử dụng font-awesome

10 Thay đổi style Checkbox và Radio vào Bootstrap

Ở video này chúng ta sẽ tận dụng những gì đã làm được ở các bài trước CSS, sprites img css hoặc font awesome để tạo nên các style cho Radio và Checkbox của Bootstrap 1 cách nhanh chóng và hiệu quả.

11 Kết thúc series và những điều cần chú ý

Ở video này mình xin chia sẻ nơi mà các bạn có thể tìm kiếm source code để dễ tìm hiểu và theo dõi lại project của mình

Bình luận


White
{{ comment.user.name }}
Bỏ hay Hay
{{comment.like_count}}
Male avatar
{{ comment_error }}
Hủy
   

Hiển thị thử

Chỉnh sửa

White

tuds

34 bài viết.
105 người follow
Kipalog
{{userFollowed ? 'Following' : 'Follow'}}
Cùng một tác giả
White
54 12
0.1 Intro Trong series này các bạn sẽ được tiếp cận từ đầu đến đích việc của một webiste tĩnh được làm như thế lào. Hứa hẹn nhiều điều thầm kính t...
tuds viết hơn 2 năm trước
54 12
White
47 5
Dạo gần đây nhà mình hay mất mạng, mà ai cũng biết rồi dân IT, Design, Gaming, XXX, mà không có internet thì hỡi ơi cứ như là sống ở thời kì đồ đá....
tuds viết gần 2 năm trước
47 5
White
27 2
Tiêu đề viết cho vui vậy chứ 2 chúng nó ly dị lâu rồi, đứa thì đi theo anh chiều cao vh height, đứa thì cưới chị chiều ngang vw width. 1 vw = 1% c...
tuds viết hơn 2 năm trước
27 2
{{like_count}}

kipalog

{{ comment_count }}

bình luận

{{liked ? "Đã kipalog" : "Kipalog"}}


White
{{userFollowed ? 'Following' : 'Follow'}}
34 bài viết.
105 người follow

 Đầu mục bài viết

Vẫn còn nữa! x

Kipalog vẫn còn rất nhiều bài viết hay và chủ đề thú vị chờ bạn khám phá!