<!doctype html> <html> <head> <meta charset="utf-8" /> <link rel="stylesheet" href="./../../reset.css"> <link rel="stylesheet" href="./ios.css"> <link rel="stylesheet" href="./ios-blue.css"> <link rel="stylesheet" href="./ios-green.css"> <link rel="stylesheet" href="./ios-red.css"> <link rel="stylesheet" href="./ios-white.css"> <link rel="stylesheet" href="./box.css"> <link rel="stylesheet" href="./box-blue.css"> <link rel="stylesheet" href="./box-green.css"> <link rel="stylesheet" href="./box-red.css"> <link rel="stylesheet" href="./box-white.css"> <link rel="stylesheet" href="./circle.css"> <link rel="stylesheet" href="./circle-blue.css"> <link rel="stylesheet" href="./circle-green.css"> <link rel="stylesheet" href="./circle-red.css"> <link rel="stylesheet" href="./circle-white.css"> </head> <body> <div style="padding: 10px; background-color: gray;"> <div class="checkbox-ios"> <input type="checkbox" id="lbl_name" name="name" /> <label for="lbl_name"></label> </div> <div class="checkbox-box"> <input type="checkbox" id="lbl_name2" name="name2" /> <label for="lbl_name2"></label> </div> <div class="checkbox-circle"> <input type="checkbox" id="lbl_name3" name="name3" /> <label for="lbl_name3"></label> </div> <br><br> <div class="checkbox-ios blue"> <input type="checkbox" id="lbl_name_blue" name="name_blue" /> <label for="lbl_name_blue"></label> </div> <div class="checkbox-box blue"> <input type="checkbox" id="lbl_name_blue2" name="name_blue2" /> <label for="lbl_name_blue2"></label> </div> <div class="checkbox-circle blue"> <input type="checkbox" id="lbl_name_blue3" name="name_blue3" /> <label for="lbl_name_blue3"></label> </div> <br><br> <div class="checkbox-ios green"> <input type="checkbox" id="lbl_name_green" name="name_green" /> <label for="lbl_name_green"></label> </div> <div class="checkbox-box green"> <input type="checkbox" id="lbl_name_green2" name="name_green2" /> <label for="lbl_name_green2"></label> </div> <div class="checkbox-circle green"> <input type="checkbox" id="lbl_name_green3" name="name_green3" /> <label for="lbl_name_green3"></label> </div> <br><br> <div class="checkbox-ios red"> <input type="checkbox" id="lbl_name_red" name="name_red" /> <label for="lbl_name_red"></label> </div> <div class="checkbox-box red"> <input type="checkbox" id="lbl_name_red2" name="name_red2" /> <label for="lbl_name_red2"></label> </div> <div class="checkbox-circle red"> <input type="checkbox" id="lbl_name_red3" name="name_red3" /> <label for="lbl_name_red3"></label> </div> <br><br> <div class="checkbox-ios white"> <input type="checkbox" id="lbl_name_white" name="name_white" /> <label for="lbl_name_white"></label> </div> <div class="checkbox-box white"> <input type="checkbox" id="lbl_name_white2" name="name_white2" /> <label for="lbl_name_white2"></label> </div> <div class="checkbox-circle white"> <input type="checkbox" id="lbl_name_white3" name="name_white3" /> <label for="lbl_name_white3"></label> </div> </div> </body> </html>