移除 IE10选择元素箭头

因此，通过 Mozilla 和 WebKit，我有了一个不错的解决方案，使用 appearance: none;替换 select框上的箭头，并且有一个父元素。

在 IE 中大部分时间我禁用了这个特性。对于 IE10，我不能真正禁用它，因为我的条件注释实际上不工作。

以下是我的标记:

<!--[if lt IE 7 ]> <html class="ie6"> <![endif]-->
<!--[if IE 7 ]>    <html class="ie7"> <![endif]-->
<!--[if IE 8 ]>    <html class="ie8"> <![endif]-->
<!--[if IE 9 ]>    <html class="ie9"> <![endif]-->
<!--[if (gt IE 9)]>    <html class="ie10plus"> <![endif]-->
<!--[if !(IE)]><!--> <html> <!--<![endif]-->

ie10plus类实际上并没有达到标记。

我也觉得可能有一个合法的方法来替换 IE 中的箭头。我并不反对真正解决这个问题。然而 appearance: none;不起作用。我能做什么？

77768 次浏览
小开

Internet Explorer 10不支持条件注释 ，所以你必须做点别的。一种解决方案是使用 JavaScript 嗅探用户代理，然后自己添加类:

<script>
if (navigator.userAgent.indexOf("MSIE 10.0") !== -1) {
document.documentElement.className += " ie10";
}
</script>

您可能应该将其添加到 <head>中，这样就不会出现未样式化内容的闪烁，但这可能不是问题。

另外，如果您正在使用 jQuery，那么您可能需要这样做:

if (navigator.userAgent.indexOf("MSIE 10.0") !== -1) {
$("html").addClass("ie10");
}

如果你想检查 IE10或更高版本，复制粘贴 getInternetExplorerVersion函数 从这个微软页面，然后将 if修改为如下所示:

if (getInternetExplorerVersion() >= 10) {
// whatever implementation you choose
}
小开

仍然不确定您想要完成什么，但是这将检测并添加 ie10的类:
--(如果! IE)-- 脚本 & # 62; 如果(/*@cc _ on!@*/false){ ClassName + = ‘ ie10 plus’; } 编译: pestwave

小开
最佳答案

避免浏览器嗅探和条件注释(目前还不支持这些 Internet Explorer 10) ，而是采取更标准的方法。对于这个特定的问题，您应该将目标对准 ::-ms-expand伪元素:

select::-ms-expand {
display: none;
}
小开

我有一个问题与一个隐藏的下拉箭头在 IE10和11的网站上，我使用 祖伯基金会的工作。在 _ form. scss 上有一行

select::-ms-expand {
display: none;
}

我 被移除了它和下拉箭头开始显示正常的所有浏览器。谢谢你的回答，乔纳森。这帮助了我在寻找了很多解决方案之后。

小开

但是! ，如果我们想增加宽度，我们不能这样做:

display:none

那么

select::-ms-expand {
/* IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
/* IE 5-7 */
filter: alpha(opacity=0);
/* Good browsers :) */
opacity:0;
}

提交答案