CSS定义Input之Radio和Checkbox的样式



<style type=”text/css”>

form#form1 {font:12px tahoma,sans-serif}

input[type=”checkbox”] {visibility:hidden;width:0;height:0;margin:0;padding:0;}

input[type=”checkbox”]+label {background:url(checkstyle.gif) no-repeat;padding-left:18px;color:#ccc;}

input[type=”checkbox”]+label:hover {color:#369;background-position:0 -16px;}

input[type=”checkbox”]:checked+label {color:#000;background-position:0 -48px;}

input[type=”checkbox”]:focus+label {color:#963;background-position:0 -32px;}

input[type=”radio”] {visibility:hidden;width:0;height:0;margin:0;padding:0;}

input[type=”radio”]+label {background:url(checkstyle.gif) no-repeat 0 -64px;padding-left:18px;color:#ccc;}

input[type=”radio”]+label:hover {color:#369;background-position:0 -80px;}

input[type=”radio”]:checked+label {color:#000;background-position:0 -112px;}

input[type=”radio”]:focus+label {color:#963;background-position:0 -96px;}

</style>