博主在尝试设计一个HTML列表元素时遇到了一个问题：当这些元素获得焦点时，它们的颜色属性会自动变为白色。尽管尝试了各种伪选择器如`:hover`, `:active`, `:visited`, `:focus`等，并设置了颜色为黑色，但在Chrome和Firefox浏览器中，这种行为仍然存在。博主展示了相关的CSS代码片段，并寻求解决方案来阻止选项元素在聚焦时颜色变为白色。
我试图设计一些< LI>元素.我无法理解为什么当他们专注时,他们的颜色属性变白.我试图包括几乎所有我知道的伪选择器并包含颜色：黑色,但无论出于何种原因,在Chrome和Firefox中我都看到了这种行为.
怎么能阻止它呢？
.select__label {
display: block;
}
.select__multiple {
border: 0;
display: block;
outline: 0;
border-collapse: collapse;
}
.select__multiple option {
border-width: 1px 0;
border-style: solid;
border-color: deepSkyBlue;
}
.select__multiple .select__option {
border: 1px solid lightGrey;
color: black;
padding: 12px 10px;
width: 150px;
}
.select__multiple .select__option:hover, .select__multiple .select__option:active, .select__multiple .select__option:visited, .select__multiple .select__option:focus, .select__multiple .select__option:checked, .select__multiple .select__option:selected {
color: black !important;
}
.select__multiple .select__option:checked {
color: black;
border-style: solid;
border-color: deepSkyBlue;
background: #dceff7 linear-gradient(0deg, #dceff7 0%, #dceff7 100%);
}
.select__multiple .select__option:checked + :checked {
border-top-width: 0;
border-top: 1px solid transparent;
}
options
option 1
option 2
option 3
option 4
option 5
2039
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
