使用IE8和Safari时，隐藏选择选项与CSS样式不兼容

HTML:

我的目标是只使用CSS隐藏选项1。这与IE9及以上版本+Chrome和FF配合良好，但不适用于IE8和Safari。我想知道代码是否可以修改，或者是否不可能在所有浏览器中隐藏一个特定的选择选项

---

您可以在此处进行测试：

您可以使用

第一个子项

隐藏第一个

标记。像这样的方法应该会奏效：

    #resource-list option[value="site"] {display: none !important;}

这就是它的作用：

由于

first child

是CSS 2.1的一部分，IE8确实支持它

更新

因为我忘了IE8不允许显示：无要处理

标记，我将在这里提供JQuery解决方案。我将保留我最初的答案，以防其他人发现它对他们的情况有用

---

使用JQuery，我们可以执行类似于

.remove（）

的操作，以完全删除第一个

标记。这实际上比

first child

技术更可取，因为它将标记从DOM中完全移除，而不仅仅是隐藏它并允许使用开发人员工具修改应用的CSS。签出以获取有关如何使用它的更多信息。

为第一个孩子尝试这些

#resource-list option:first-child {
  display: none;
}

或

或

或

---

答案是，由于IE不支持在select（组合框、下拉控件）中隐藏选项标记，因此将每个选项包装在一个span标记中，类似于将类应用于该span标记以隐藏它或其他内容。我做到了，它对我有用；这是我在演示中使用的线程，选项1没有隐藏在Mac OS X上的Chrome 31中。Javascript完全不存在吗？我想是的，但我想确认一下。@shshaw真的吗？该死在Window7+chrome29和Ubuntu+Chromium下，otpion被很好地隐藏了。@Dryden Long如果在CSS中不可能，也许可以使用JS。你有什么建议吗？@dotcom27这里有一个屏幕截图：我很确定跨浏览器可靠地删除/隐藏它的唯一方法是使用Javascript。我不想像@dryden那样编写display:none。。没有测试过，抓到了。这没什么区别。您只是使用了一个不同的（也可能不太受支持的）选择器来访问同一个元素。

#resource-list option:first-child {
  display: none;
}

width: 0; height: 0;

visibility: hidden;

opacity: 0;

position: absolute; top: -9999px; left: -9999px;