漂亮的checkbox样式(多选框)完美兼容IE8/9/10，FF等
后来在csscheckbox.COM上找到很多样式，结果一测兼容性IE不行。如此一来，耽误了很久的时间。
抄了近道屡试不行，回归jquery UI，不用说兼容性挺好，而且样式自己随心画。
在此记录一款checkbox的样式，供大家也供我以后方便使用。
有三种状态，default、hover和active，并测试过，能完美兼容IE8/9/10，FF等。
复制代码代码如下:
!doctyPE htML>
html lang="en">
head>
meta charset="utf-8" />
link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
script src="http://code.jquery.com/jquery-1.9.1.js">
/script>
script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js">
/script>
script>
$(function() {
$( "#check" ).button();
$( "#format" ).buttonset();
}
);
/script>
style>
.ui-button-text-only .ui-button-text {
padding: 8px;
}
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
background: url(images/safari-checkbox.png) 0 0 no-repeat;
border:none;
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus {
background: url(images/safari-checkbox.png) -16px 0 no-repeat; border:none;
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
background: url(images/safari-checkbox.png) 0 -16px no-repeat; border:none;
}
/style>
/head>
body>
input type="checkbox" id="check" /> label for="check"> /label>
/body>
/html>
声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！
若转载请注明出处： 漂亮的checkbox样式(多选框)完美兼容IE8/9/10，FF等
本文地址： https://pptw.com/jishu/587886.html