發布日期:2024 年 10 月 23 日
本文將說明如何在您自己的網站上使用新的 <baseline-status>
網頁元件,以及在您撰寫或談論網頁平台功能時,在簡報中使用基準標誌。
大部分的開發人員都曾在搜尋網頁開發問題需要的解決方案,找出一篇文章說明最佳解決方案,然後發現這項功能只在單一瀏覽器中提供。或者,你可能會對會議講者所描述的功能感到興奮,但後來發現該功能是實驗性質。我們希望藉此改善 Chrome 開發人員網站的功能。過去兩年來,我們一直在貼文中 加入 MDN 的相容資料。
基準則能更清楚地顯示內容。您可以檢查功能是否已廣泛提供,而非檢查個別瀏覽器版本,這樣就能放心使用。或者,您可能會發現該功能是新推出的 Baseline 功能,因此可互通,但由於是新功能,因此您可能需要考慮備用策略。在 web.dev 中,我們已開始在部分頁面中新增新的基準狀態元件,您可以在 CSS font-size-adjust 的網誌文章中看到這項元件。
將元件新增至網站
這個網頁元件不只供我們使用。很高興與您分享 <baseline-status>
元件。您可以使用這項功能,在所建立的內容上顯示基準狀態。您可以從 npm 安裝元件,也可以從 CDN 預先編譯元件。請參閱安裝說明。安裝完成後,顯示功能狀態,如以下 font-size-adjust
的 HTML 所示。
<baseline-status featureId="font-size-adjust"></baseline-status>
當功能從「僅限部分國家/地區」變更為「新推出」或「全線推出」時,元件就會自動更新。
尋找featureId
傳入元件的 featureId
是 web-features 存放區中功能的名稱。元件會從透過Web 功能專案收集的資料取得功能狀態。
新增基準標誌
如果您要透過平面媒體、PDF 或在研討會上發布內容,標誌可能有助於顯示當時的狀態。網頁平台狀態資訊主頁可協助您查看任何功能的基準狀態。
您可以下載 PNG 和 SVG 格式的標誌,並在所有素材資源中使用。
請告訴我們您使用基準的地區
我們很想知道 Baseline 的使用情形。建立 PR,並在您使用該檔案的連結中加入實際使用基準。
您是否有其他整合想法?
您是否有其他方式可以整合 Baseline?您可能有可納入這類資訊的開發人員工具,或是可從分享管理控制台使用的基準版本而受益的產品。提出問題並提供想法,我們很樂意提供協助。