TextMetrics：fontBoundingBoxDescent 屬性

Baseline 2023

新推出

自 2023 年 8 月起，此功能已在最新的裝置和瀏覽器版本中可用。此功能可能不適用於舊裝置或瀏覽器。

注意：此功能在 Web Workers 中可用。

TextMetrics 介面的只讀屬性 fontBoundingBoxDescent 返回從 CanvasRenderingContext2D.textBaseline 屬性所指示的水平線到用於渲染文字的所有字型的邊界矩形底部的距離，以 CSS 畫素為單位。

值

一個數字，以 CSS 畫素為單位。

示例

以下程式碼展示瞭如何獲取特定字型中文字的 fontBoundingBoxDescent。

const canvas = document.createElement("canvas");
const ctx = canvas.getContext("2d");

ctx.font = "25px serif";
const text = "Foo";

const textMetrics = ctx.measureText(text); // returns TextMetrics object
const descentCssPixels = textMetrics.fontBoundingBoxDescent;

<p id="log"></p>

const log = document.getElementById("log");
log.innerText = `fontBoundingBoxDescent: ${descentCssPixels}`;

下面顯示了 25px serif 字型中“Foo”文字的 CSS 畫素下降距離。

規範

規範
HTML # dom-textmetrics-fontboundingboxdescent-dev

瀏覽器相容性

另見

幫助改進 MDN

瞭解如何貢獻

此頁面最後修改於 ⁨2024年9月18日⁩，由 MDN 貢獻者修改。

在 GitHub 上檢視此頁面 • 報告此內容的問題