Question

所以我正在尝试使用 css 设置一个 select 元素的样式。到目前为止，我实际上已经成功了。唯一的问题是（在 chrome 中），当元素失去焦点时，它会失去样式。

我目前的 css 是：

class Weight_Loss_DietActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_weight__loss__diet)
        val content = findViewById(R.id.content) as TextView
        val title = findViewById(R.id.titlewindow) as TextView

        title.setText("WALKING");
        val builder = StringBuilder()
        builder.append(title)
        content.setText("The Content, check the Image")

    }
}

（这些变量是因为我使用的是 scss，但我认为这并不重要）

HTML 是：

select[multiple]:focus option.option-styling {
  font-size: large;
}

select[multiple] option.option-styling {
  font-size: large;
}

select[multiple]:focus option:checked.option-styling {
  background: $dark linear-gradient(0deg, $dark 0%, $dark 100%);
  color: $white !important;
}

select[multiple] option:checked.option-styling {
  background: $dark linear-gradient(0deg, $dark 0%, $dark 100%);
  color: $white !important;
}

select[multiple]:focus option.option-styling {
  background: $white linear-gradient(0deg, $white 0%, $white 100%);
  color: $black !important;
}
select[multiple] option.option-styling {
  background: $white linear-gradient(0deg, $white 0%, $white 100%);
  color: $black !important;
}

一切看起来都很好，直到元素失去焦点，然后字体颜色总是黑色。

Example while in focus
Example while out of focus
您还可以看到它计算黑色，即使优先颜色是红色 here
我也试过将 <select class="command-list" multiple="multiple" (focus)="onFocus()" (blur)="onBlur()" [size]="this.commandList.length" #commandList> <option class="option-styling" value="Merceders"> Merceders </option> <option class="option-styling" value="BMW"> BMW </option> <option class="option-styling" value="Jaguar"> Jaguar </option> <option class="option-styling" value="Lamborghini"> Lamborghini </option> <option class="option-styling" value="Ferrari"> Ferrari </option> <option class="option-styling" value="Ford"> Ford </option> </select> 直接应用于元素的样式，但无济于事。

仅适用于 chrome，这让我发疯了，任何帮助将不胜感激。谢谢。

失焦时无法覆盖 <option> 字体颜色

0 个答案: