是否可以在下拉菜单中选择CSS样式选择选项? [英] Is it possible to css style select option on dropdown?

问题描述

我在Stackoverflow论坛上查找了此帖子.

I looked up this post on Stackoverflow forum.

如何设置< option>样式只有CSS?

许多人声称这是无法在CSS中实现的，并且存在许多跨浏览器的兼容性问题.

Many people claimed that this is not possible to achieve in CSS and there are a number of cross-browser compatibility issues.

我尝试使用以下代码为上面附加的图像(红色圆圈)编码我的css.

I tried to code my css for the above attached image(circled in red) using the following.

.hovercard-container .dropdownfield select option{
  background-color: #BDBEC1;
  border: 1px solid #000;
}

但这在Safari/Chrome/IE中不起作用.仅在Firefox中可用.

But this doesnt work in Safari/Chrome/IE. Only works in Firefox.

是否仍然可以在选择选项标签的下拉菜单中实现CSS样式?如果没有，是否还有其他方法可以让我像上图那样设置样式?

Does anybody can the CSS styling still be achieved on dropdown for select option tags? If not, are there any other methods that would allow me to style just like the image above?

推荐答案

使用相同的样式和跨浏览器效果不可能实现这一目标.有些浏览器可能提供比其他浏览器更多的样式，但这不是解决方案.

It's not possible to achieves this with the same styling and effects cross-browser. Some browsers may offer more styling that the other, but that's not a solution.

我建议使用jQuery插件，例如 https://plugins.jquery.com/select2/或 https://plugins.jquery.com/chosen/-它们会变成普通的<SELECT>控件成为时尚之美.

I suggest using jQuery plugings such as https://plugins.jquery.com/select2/ or https://plugins.jquery.com/chosen/ - they turn your ordinary <SELECT> control into styled beauty.

这篇关于是否可以在下拉菜单中选择CSS样式选择选项?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！