选择菜单选项border none [英] Select menu option border none
问题描述
我试图更改选择选项边框，但无法这样做，我已经尝试过很多次，但找不到正确的解决方案。我已附加屏幕截图。
I am trying to change select option border but unable to do that, I have tried it many times but not find the proper solution. I have attached the screen shot .
<head>
<style>
select option {
background:transparent;
border:0;
}
</style>
</head>
<body>
<select>
<option>hello</option>
<option>hello</option>
<option>hello</option>
<option>hello</option>
<option>hello</option>
</select>
</body>
推荐答案
select的下拉列表是 ShadowDOM 。在当前CSS规范中，级别3，没有办法定位大多数ShadowDOM元素。您可以阅读ShadowDOM上的规范这里，虽然没有太多关于您想要什么。
The dropdown of a select is part of what's called the ShadowDOM. In the current CSS specs, level 3, there's no way to target most ShadowDOM elements. You can read the specs on the ShadowDOM here, though there's not much in there regarding what you want.
Chrome有几个专有选择器可以更改一些 shadowDOM元素，但不是全部。 Firefox甚至更少（据我所知），而Opera没有。 IE可能是同样糟糕或更坏。
Chrome has a few proprietary selectors to change some shadowDOM elements, but not all. Firefox has even fewer (as far as I know), and Opera has none. IE is probably just as bad or worse.
您最好的注意兼容性是使用Jquery插件来模仿选择使用其他HTML元素，如果你真的想风格它。 这是一个整洁的。
Your best bet with compatibility in mind is to use a Jquery plugin to mimic the select using other HTML elements if you really want to style it. Here's a neat one.
这篇关于选择菜单选项border none的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
