CSS 提供的 font-palette 属性允许您指定字体中包含的各种调色板之一。
可能的值
- normal:设置默认调色板或字形着色。将呈现索引 0 处的调色板。
- light:设置与 'light' 匹配的第一个调色板。如果未找到匹配项,则其行为与正常情况类似。
- dark:设置与 'dark' 匹配的第一个调色板。如果未找到匹配项,则其行为与正常情况类似。
- <palette identifier>:允许使用 @font-palette-values 规则指定您自己的调色板。
适用于
所有 HTML 元素。
DOM 语法
object.style.fontPalette = "normal | <palette identifier>";
CSS font-palette - 基本示例
下面是一个示例:
<html>
<head>
<style>
@import url(https://fonts.googleapis.com/css2?family=Bungee+Spice);
@font-palette-values --bungee-more-spicy {
font-family: "Bungee Spice";
override-colors:
0 Orange,
1 Yellow;
}
h2 {
font-family: "Bungee Spice";
}
h2.more-spicy {
font-palette: --bungee-more-spicy;
}
</style>
</head>
<body>
<h2>Font face</h2>
<h2 class="more-spicy">Hot & burning</h2>
</body>
</html>