Loading...
Loading...
Loading...
Loading...

Style checkbox and readio button using CSS?

View: 494    Dowload: 0   Comment: 0   Post by: hanhga   Category: HTML-CSS template   Fields: Other

Example-1, Hide the boxes :

input[type=radio],
input[type=checkbox] {
    display: none;
}

Example-2, Stylize the before :

.radio label:before {
    border-radius: 8px;
}
.checkbox label:before {
    border-radius: 3px;
}

Example-3, Stylize the after :

input[type=radio]:checked {
    content: "\2022";
    color: #f3f3f3;
    font-size: 30px;
    text-align: center;
    line-height: 18px;
}
 
input[type=checkbox]:checked {
    content: "\2713";
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .2);
    font-size: 15px;
    color: #f3f3f3;
    text-align: center;
    line-height: 15px;
}

Style checkbox and readio button using CSS?

Style checkbox and readio button using CSS

Posted on 31-08-2016 

Comment:

To comment you must be logged in members.

Files with category

 
File suggestion for you
File suggestion for you
File suggestion for you
File suggestion for you
Loading...
Loading...
Loading...
Loading...
File top downloads
File top downloads
File top downloads
File top downloads
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Codetitle - library source code to share, download the file to the community
Copyright © 2018. All rights reserved. codetitle Develope by Vinagon .Ltd