Vue-Bootstrap B-选择选项悬停 [英] Vue-Bootstrap b-select option hover

问题描述

我正在使用Vue-Bootstrap框架，当您将鼠标悬停在元素上时，我想重写标签'option'的css规则

I'm using Vue-Bootstrap framework, I want to rewrite the css rule for tag 'option' when you hover the element

我的代码是这样的 jsfiddle

option:hover {
  background-color: red;
}

为什么'option:hover'中的background-color在不是悬停事件时而不是在悬停事件时改变背景?

Why the background-color in 'option:hover' change the background when is not hover event, and not when is a hover event?

谢谢！

推荐答案

b-select 是渲染后的本机 select 元素.选择的样式通常可以在一定程度上设置样式，但是选项通常受操作系统(而不是HTML/CSS)设置的限制，因此非常受限制.

b-select is a native select element once rendered. The style of the select can usually be styled to a degree, however the options are usually very limited as they're styled by the OS and not HTML/CSS.

这在移动浏览器上尤其如此，与PC相比，选择的行为截然不同.

This is especially a thing on mobile browsers, where selects act very differently compared to a PC.

您可以尝试查看此问题以获取一些可能的解决方案，但是它们对浏览器的支持非常有限.在悬停时更改选择列表选项背景颜色

You can try taking a look at this question for some possible solutions, however they're very limited in browser support. Change Select List Option background colour on hover

这篇关于Vue-Bootstrap B-选择选项悬停的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！