Css 为什么应用于选择的不透明度不应用于选项？

应用于

的不透明度不应用于作为子元素的

，为什么

此功能允许创建自定义下拉列表，这些列表在不同平台上看起来一致，但同时保留选项的本机行为

我想知道这种行为有多可靠。这是标准还是技巧

选择{
不透明度：0；
边界：无；
高度：24px；
显示：块；
利润上限：-24px；
边框：1px纯红；
宽度：100%；
}
div{
显示：内联块；
边框：1px实心#ccc；
边界半径：4px；
}
跨度{
显示：块；
填充：0 10px；
线高：24px；
}

点击我
选择1
选择2
选择3

这是浏览器的默认行为，您不能仅通过

来影响它。但您可以使用自定义选择框，其中之一是

---

但是请记住，移动设备针对

元素进行了优化，并且使用jQuery插件可能看起来不像预期的那样。但是，当您想要自定义选择选项时，这是一个良好的开端。

根据我对规范的理解，这是不可靠的

表示

不透明度

也会影响元素的内容（强调）：

从概念上讲，在元素（包括其子元素）之后 渲染为RGBA屏幕外图像时，“不透明度”设置指定 如何将屏幕外渲染混合到当前合成中 渲染

但是，

select

元素将被替换。a是

内容超出CSS格式范围的元素 型号[…]
替换元素的内容不在本标准中考虑 CSS呈现模型

---

因此，

opacity

可能不会影响被替换元素的内容。但这也可能会影响它。

谢谢，你的答案正是我想要的，只是我希望能有一点确定性。我所描述的行为在不同平台上似乎是一致的，我在一些知名网站上看到过这种行为。我想知道浏览器制造商在实现这一功能时考虑了什么，我猜这是您引用的关于“替换元素”的第二个声明。如果很快没有其他回应，我会接受你的回答：）我描述的技术是移动友好的，它显示一个定制的标签，当你点击或点击它时，你会得到一个本地选项列表。我的问题是将“select”元素的不透明度设置为0是否安全。如果将来的浏览器实现也会将“选项”不透明度设置为0，从而打破这种自定义下拉技巧，那该怎么办呢？它对移动设备很友好，但短期内您将无法获得自定义项目。如果你真的想要，那么jQuery插件是唯一的选择。你应该坚持浏览器现在能做什么，而不是将来能做什么。