如何更改引导程序组件中图标的颜色

问题描述 投票：0回答：1

我在我的 

Vue
项目中实现了暗模式，这是我用 
Bootstrap 5.2
创建的。

但是我不知道如何改变下面两个的颜色（应该是白色）

icons
：

这是来自

form-select

这是来自

input type="time"

我怎样才能做到这一点？

代码

<template>
  <input class="form-control" type="time" />
  <select class="form-select"></select>
</template>
vue.js colors icons bootstrap-5
1个回答
0
投票

Bootstrap 5.3 实现暗模式。如果升级到 5.3，只需使用 

<html data-bs-theme="dark">..

，输入插入符就会变成浅色

演示 - 5.3 暗模式输入

如果你想使用 5.2，你需要覆盖 

form-select
类背景图像 SVGs 
stroke
颜色以更改插入符号颜色...

.form-select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e")
}

演示 - 5.2 深色主题输入

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.