此页面由社区从英文翻译而来。了解更多并加入 MDN Web Docs 社区。
font-kerning
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2020年1月.
font-kerning CSS 属性设置是否使用字体中储存的字距信息。
css
/* Keyword values */font-kerning: auto;font-kerning: normal;font-kerning: none;/* Global values */font-kerning: inherit;font-kerning: initial;font-kerning: unset;Kerning（字距）定义了字母的分布情况。对于良好地规定了字距的字体，字距特性使得字母分布更为统一，阅读体验更佳。如下图所示，左侧的示例没有应用字距，而右侧使用了：
| 初始值 | auto |
|---|---|
| 适用元素 | 所有元素和文本. It also applies to::first-letter and::first-line. |
| 是否是继承属性 | 是 |
| 计算值 | as specified |
| 动画类型 | 离散值 |
语法
font-kerning 属性通过以下的关键字进行指定。
值
形式语法
font-kerning =
auto|
normal|
none
示例
HTML
html
<div></div><div></div><textarea>AV T. ij</textarea>CSS
css
div { font-size: 2rem; font-family: serif;}#nokern { font-kerning: none;}#kern { font-kerning: normal;}JavaScript
js
var input = document.getElementById("input"), kern = document.getElementById("kern"), nokern = document.getElementById("nokern");input.addEventListener("keyup", function () { kern.textContent = input.value; /* Update content */ nokern.textContent = input.value;});kern.textContent = input.value; /* Initialize content */nokern.textContent = input.value;规范
| Specification |
|---|
| CSS Fonts Module Level 4 # font-kerning-prop |