Question

我对 Internet Explorer 11 有一个可怜的问题，因为它不能正确缩放复选框，这与 Firefox 正确无关。这是我的css代码：

-ms-filter

我用filter: progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', M11=1.5320888862379554, M12=-1.2855752193730787, M21=1.2855752193730796, M22=1.5320888862379558);替换了它，但它不起作用：

    -ms-transform: scale(1.5);

然后使用它，但它仍然无效：

scale()

不幸的是，我的所有尝试都没有成功，因此它没有说它如何解决它。通常情况下<!doctype html> <html> <head> <title>JavaScript String fontcolor() Method</title> <style> #alertoverlay{display: none; opacity: .8; position: fixed; top: 0px; left: 0px; background: #FFF; width: 100%;} #alertbox{display: none; position: fixed; background: #000; border:7px dotted #12f200; border-radius:10px; font-size:20px;} #alertbox > div > #alertboxhead{background:#222; padding:10px;color:#FFF;} #alertbox > div > #alertboxbody{ background:#111; padding:40px;color:red; } #alertbox > div > #alertboxfoot{ background: #111; padding:10px; text-align:right; } </style> <script> function CustomAlert(){ this.on = function(alert){ var winW = window.innerWidth; var winH = window.innerHeight; alertoverlay.style.display = "block"; alertoverlay.style.height = window.innerHeight+"px"; alertbox.style.left = (window.innerWidth/3.5)+"pt"; alertbox.style.right = (window.innerWidth/3.5)+"pt"; // remove this if you don't want to have your alertbox to have a standard size but after you remove modify this line : alertbox.style.left=(window.inner.Width/4); alertbox.style.top = (window.innerHeight/10)+"pt"; alertbox.style.display = "block"; document.getElementById('alertboxhead').innerHTML = "JavaScript String fontcolor() Method :"; document.getElementById('alertboxbody').innerHTML = alert; document.getElementById('alertboxfoot').innerHTML = '<button onclick="Alert.off()">OK</button>'; } this.off = function(){ document.getElementById('alertbox').style.display = "none"; document.getElementById('alertoverlay').style.display = "none"; } } var Alert = new CustomAlert(); </script> </head> <body bgcolor="black"> <div id="alertoverlay"></div> <div id="alertbox"> <div> <div id="alertboxhead"></div> <div id="alertboxbody"></div> <div id="alertboxfoot"></div> </div> </div> <script>Alert.on("Hello World!");</script> </body> </html>应该可以在IE 9上运行，但似乎它们在IE 11中禁用了它。正如我所说，它在Firefox中运行良好但在IE 11中运行不正常。

Answer 1

Here我读到了：

[5] Internet Explorer 11.0支持-webkit prefixed variant as an alias for the default one。

如果这没有帮助，这可能是特定于复选框的问题。但是，有一种更好的方法可以使用 HTML 和 CSS 设置复选框样式：

＆＃13;

input[type=checkbox] {
  display: none;
}

input[type=checkbox] + .cb {
  display: inline-block;
  width: 22px;
  height: 22px;
  margin: -4px 0;
  border: 1px solid gray;
  border-radius: 3px;
  transition: .2s;
  box-sizing: border-box;
  box-shadow: inset 0 0 0 1px white;
}
input[type=checkbox] + .cb:before {
  content: "✓";
  color: white;
  position: absolute;
  line-height: 20px;
  font-size: 16px;
  margin: 0 0 0 5px;
}

input[type=checkbox] + .cb:hover {
  box-shadow: inset 0 0 0 1px #0055ff;
  border-color: #0055ff;
}

input[type=checkbox]:checked + .cb {
  box-shadow: inset 0 0 0 10px #0055ff;
  border-color: #0055ff;
}

input[type=checkbox]:checked + .cb:hover {
  box-shadow: inset 0 0 0 10px #3377ff;
}

＆＃13;

<label>
  <input type="checkbox" checked>
  <div class="cb"></div>
  Style checkbox with CSS
</label>

＆＃13;

增加IE 11中的复选框大小

1 个答案: