二十六、css3改变checkbox复选框的样式
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style> span { position: relative; } .input_check { position: absolute; visibility: hidden; } .input_check+label { display: inline-block; width: 16px; height: 16px; border: 1px solid #c00; } .input_check:checked+label:after { content: ""; position: absolute; left: 2px; bottom: 12px; width: 9px; height: 4px; border: 2px solid #e92333; border-top-color: transparent; border-right-color: transparent; -ms-transform: rotate(-60deg); -moz-transform: rotate(-60deg); -webkit-transform: rotate(-60deg); transform: rotate(-45deg); } </style> </head> <body> <span><input type="checkbox" class="input_check" id="check3"><label for="check3"></label></span> </body> </html>