text-rendering

text-rendering 屬性為渲染器提供有關在渲染文字時要進行哪些權衡的提示。

注意：作為表示屬性，text-rendering 可用作 CSS 屬性。有關更多資訊，請參閱 CSS text-rendering 屬性。

您可以將此屬性與以下 SVG 元素一起使用

<text>

示例

html,
body,
svg {
  height: 100%;
}

html

<svg viewBox="0 0 140 40" xmlns="http://www.w3.org/2000/svg">
  <text y="15" text-rendering="geometricPrecision">Geometric precision</text>
  <text y="35" text-rendering="optimizeLegibility">Optimized legibility</text>
</svg>

使用說明

值	`auto` \| `optimizeSpeed` \| `optimizeLegibility` \| `geometricPrecision`
預設值	`auto`
可動畫	離散

auto: 此值表示使用者代理應進行適當的權衡以平衡速度、清晰度和幾何精度，但應優先考慮清晰度而不是速度和幾何精度。
optimizeSpeed: 此值表示使用者代理應優先考慮渲染速度而不是清晰度和幾何精度。此選項有時會導致某些使用者代理關閉文字抗鋸齒。
optimizeLegibility: 此值表示使用者代理應優先考慮清晰度而不是渲染速度和幾何精度。使用者代理通常會選擇是否應用抗鋸齒技術、內建字型提示或兩者以生成最清晰的文字。
geometricPrecision: 此值表示使用者代理應優先考慮幾何精度而不是清晰度和渲染速度。此選項通常會導致使用者代理暫停使用提示，以便字形輪廓以與路徑資料的渲染相當的幾何精度繪製。

規範

規範
可縮放向量圖形 (SVG) 2 # 文字渲染

瀏覽器相容性

BCD 表格僅在啟用 JavaScript 的瀏覽器中載入。

另請參閱

text-rendering