css - 如何在 Metro Apps 中对输入范围的左侧部分进行样式化?

标签 css windows-8

我目前正在尝试在我的一个 Metro 应用程序中对输入类型范围进行样式化。但是,我找不到如何更改控件左侧的默认蓝色/紫色。有什么想法吗?

我成功地使用以下 CSS 更改了标记和右侧部分的颜色:

html input[type=range]::-ms-track {
  background: yellow;
}

html input[type=range]::-ms-thumb {
  background: red;
}

所以,我想一定有类似的东西。但什么? :/

最佳答案

您可以使用这些 CSS 类来设置范围控件左侧的颜色样式:

input[type=range]::-ms-fill-lower {
    background-color: rgb(0, 130, 135); /* same in dark and light */
}
input[type=range]:hover::-ms-fill-lower {
    background-color: rgb(33, 146, 151); /* same in dark and light */
}
input[type=range]:active::-ms-fill-lower {
    background-color: rgb(37, 187, 196); /* same in dark and light */
}
input[type=range]:disabled::-ms-fill-lower {
    background-color: rgba(255, 255, 255, 0.24);
}
.win-ui-light input[type=range]:disabled::-ms-fill-lower {
    background-color: rgba(0, 0, 0, 0.24);
}

请注意,以上是默认值,您必须用您的颜色覆盖它们。

如果您正在寻找控件的其他颜色设置或不同的控件,请在 dark-ui.css 文件中搜索控件类型。每个控件都有一个单独的颜色部分

关于css - 如何在 Metro Apps 中对输入范围的左侧部分进行样式化?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10750865/

相关文章:

javascript - Angular 8 : Assign Date Values to Type Moment

css - 使用 Java 以编程方式在 Vaadin 14 中通过 CSS 指定背景图像

delphi - 使用 Delphi 开发 native Metro 应用程序的资源

c++ - 如何检测是否显示 Metro UI?

c# - 开发人员是否可以通过 "force"系统来防止 "Metro"应用程序在后台异步进程运行时被挂起?

c# - 如何访问文件夹并获取 WinRT 类库中的存储文件列表?

javascript - ListView不显示数据

css - 使用 CSS 包装器不需要的填充图像的左边距

css - 为 ActionLink 应用颜色

jquery - 在表中添加滚动到除第一列以外的所有列