html - 在 IE8 上禁用 CSS3 复选框

标签 html css internet-explorer

我的 CSS3 复选框有以下 CSS。它适用于所有现代浏览器,但不适用于 IE8,因此我想禁用这些特殊复选框并保留默认复选框。可能吗?

   input[type=checkbox].css-checkbox {
    position:absolute;
    z-index:-1000;
    left:-1000px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    height:1px;
    width:1px;
    margin:-1px;
    padding:0;
    border:0;
    }

input[type=checkbox].css-checkbox + label.css-label {
    padding-left:17px;
    height:15px; 
    display:inline-block;
    line-height:15px;
    background-repeat:no-repeat;
    background-position: 0 0;
    font-size:15px;
    vertical-align:middle;
    cursor:pointer;
    }

input[type=checkbox].css-checkbox:checked + label.css-label {
    background-position: 0 -15px;
        }
label.css-label {
    background-image:url('../gfx/checkbox.png');
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    }

还有一些 HTML5 代码:

 <input type="text" size="50" name="dni" value="%dni" class="forminput" style="width: 40px">
<div style="padding-top:10px">Usuwaj tylko zdjęcia pozostawiając artykuły i komentarze&nbsp; 
<input name="czy_tylko_zdjecia" type="checkbox" value="1" %czy_tylko_zdjecia id="checkbox_settings" class="css-checkbox">
<label for="checkbox_settings" class="css-label"></label>

最佳答案

它在 IE8 中不值得,因为 CSS3 :checked pseudo class不是 supported .

您可以针对 IE8 并使用条件覆盖您的值:

<!--[if IE 8]>
<style>
    input[type=checkbox].css-checkbox {
        position: static;
        z-index: auto;
        left: auto;
        overflow: visible;
        clip: auto;
        height: auto;
        width: auto;
        margin: 0;
    }
</style>
<![endif]-->

您还可以使用 \9 hack针对 IE8 及以下版本:

input[type=checkbox].css-checkbox {
    position: static\9;
    z-index: auto\9;
    left: auto\9;
    overflow: visible\9;
    clip: auto\9;
    height: auto\9;
    width: auto\9;
    margin: 0\9;
}

关于html - 在 IE8 上禁用 CSS3 复选框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28440605/

相关文章:

html - 了解 CSS 选择器优先级/特殊性

html - 带有边框和填充的内联 div block 导致 div 超出页边距

媒体查询中文本下方的 CSS 按钮位置

javascript - 在窗口调整大小时,根据其容器保持子元素水平对齐,并根据其他子元素保持左对齐

html - 你能改变IE7中滚动条(滚动DIV)的宽度吗

html - 首页表位置偏移

javascript - 使用 jQuery 链接到 Accordion 中的部分

php - 通过表单将数据从一个表插入到另一个表

Jquery 代码禁用了图像上的超链接?

javascript - IE-8 Flash 后备可以离线工作但不能在线工作