Adam Argyle
公開日: 2025 年 3 月 6 日
2 月 25 日に Chrome は @function のリリースに関するお知らせを公開し、テストフェーズを延長するよう求めるフィードバックを受けました。全体的なテストフェーズは短くはありませんでしたが、最近、影響の大きい仕様変更がいくつかあり、それらをテストするためにもう少し時間が必要でした。
また、このテストフェーズの延長により、コミュニティでのテストがさらに進むことを期待しています。
テストへの呼び出し
ぜひ Canary を入手して、試験運用版のウェブ プラットフォーム機能を有効にし、CSS @function のテストを始め、見つかったバグを報告してください。テストにかける時間を長く取れるようになったので、この機会を活用しましょう。
以下に、いくつかの探索例を示します。
次の CSS は、簡潔ながらも有用な例を示しています。
@function --light-dark(--light, --dark) {
result: var(--light);
@media (prefers-color-scheme: dark) {
result: var(--dark);
}
}
@function について詳しくは、
Bramus には優れたデモが揃っています。CSS Tricks もすぐにこのニュースに飛びつきました。
引数？戻り値？コーヒーを吐き出す価値があります。詳しく調べる必要がありましたが、幸い、仕様は明確に記述されています。