基于所选配色方案的 CSS 元素

开发
2

你好，

有几种方法可以做到。

例如：

你可以在 admin/customize/colors/ 中更改配色方案的颜色。只需选择你的暗模式配色方案并更改 secondary 颜色代码。

注意：这将更改所有位置的次要颜色，而不仅仅是标题图标。

或者你可以使用 prefers-color-scheme 媒体查询在暗模式下将 secondary 更改为 secondary-low。

类似这样：

.d-header-icons .d-icon {
  width: 100%;
  line-height: 1.4;
  display: inline-block;
  color: var(--secondary);
  @media (prefers-color-scheme: dark) {
    color: var(--secondary-low);
  }
}

或者你可以创建自定义颜色定义：Why might dark-light-choose() not work? - #2 by awesomerobot

希望这有帮助 :slightly_smiling_face:

2 个赞