如何设置复选框和单选输入的样式,以便在所有浏览器(IE8、firefox、webkit 等)上看起来统一。我尝试了各种方法,但直到现在什么都没有。我只想设置复选框和单选的样式,而不是我在其他网络示例中看到的标签或跨度。这里的一点帮助将非常棒。这是一个小提琴示例:http: //jsfiddle.net/FKRaX/11/
谢谢你。
如何设置复选框和单选输入的样式,以便在所有浏览器(IE8、firefox、webkit 等)上看起来统一。我尝试了各种方法,但直到现在什么都没有。我只想设置复选框和单选的样式,而不是我在其他网络示例中看到的标签或跨度。这里的一点帮助将非常棒。这是一个小提琴示例:http: //jsfiddle.net/FKRaX/11/
谢谢你。
您将需要 3d 方 JS 库,例如此处列出的库:http: //line25.com/articles/jquery-plugins-for-styling-checkbox-radio-buttons
纯 CSS 解决方案仅适用于 webkit 浏览器,并且可能适用于最新的 Firefox。但是对于 IE8,你肯定需要使用一些 JS/jQuery 插件来实现这一点。
你试过:
文件.css:
.checkbox {
margin:15px;
/*opacity:0;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);*/
}
文件.html
<input id="pushon" type="checkbox" checked="checked" class="checkbox" />
<input id="pushon" type="checkbox" disabled="disabled" class="checkbox" />
<input id="pushon" type="checkbox" checked="checked" disabled="disabled" class="checkbox" />
<input id="roundon" type="radio" value="Valoare" checked="checked"/>
<input id="roundon" type="radio" value="Valoare" disabled="disabled"/>
<input id="roundon" type="radio" checked="checked" disabled="disabled" />
For older IEs 8, 7, etc you may need to get creative:
E.g.
input[type="checkbox"],
#checkboxFieldsID,
.checkboxFieldsClass {
display:inline-block;
-ms-transform: scale(3); /* IE */
-moz-transform: scale(3); /* FF */
-webkit-transform: scale(3); /* Safari and Chrome */
-o-transform: scale(3); /* Opera */
padding: 10px;
/* tricks for older IEs */
background:#40668C; /* trick for older IEs */
width:50px; /* trick for older IEs */
height:50px; /* trick for older IEs */****
}