CSS - font-palette 属性_CSS 菜鸟教程

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>

<< CSS - @font-feature-values CSS - @font-palette-values >>