CSS 函数 -webkit-named-image() 的规范是什么？

Question

我正在浏览 this stylesheet 时注意到一个我以前从未遇到过的 CSS 函数：-webkit-named-image()

我进行了一些挖掘并在 SO and a developer page here 上找到了链接。我能找到的这个函数唯一明显有效的参数是 apple-pay-logo-black 和 apple-pay-logo-white，例如：

div { background-image: -webkit-named-image(apple-pay-logo-black) ;}

我有很多问题，例如：

此功能是否已弃用或目前仍然有效？（基于 this link and this one 的新近度，我认为它没有被弃用）。这个函数还有其他可接受的参数吗（除了我上面提到的那些）？这个函数是否类似于 url() 函数，因为传递的函数参数可以被引用或不被引用？它是特定于 Safari 的吗？

简而言之，我如何才能找到有关此功能的更多信息以及实际用例是什么？

Answer 1

此 CSS 函数是特定于供应商的，因此没有规范。用于显示WebKit中嵌入的一些命名图像。

要发现此函数的有效参数，一种解决方案是查看 source code of WebKit. The C++ function associated to this CSS function is drawNamedImage from the Theme class。

virtual void drawNamedImage(const String&, GraphicsContext&, const FloatRect&) const;

drawNamedImage执行中有注释：

void Theme::drawNamedImage(const String& name, GraphicsContext& context, const FloatRect& rect) const
{
    // We only handle one icon at the moment.
    if (name != "wireless-playback")
        return;

但是每个主题都可以覆盖这个函数并定义自己的命名图像。 Cocoa theme 定义值 wireless-playback、apple-pay-logo-black 和 apple-pay-logo-white。

WebKit 的源代码中还没有其他主题定义命名图像。

Answer 2

-webkit-named-image() CSS 生成器允许站点按名称请求图稿并获取平台变体并且最近被添加到 webkit。

检查这个 bug，它在前一段时间已经解决了 https://bugs.webkit.org/show_bug.cgi?id=164235

目前我所知道的 Safari 现在带有内置图像，我们可以使用 -webkit-named-image()。

根据条纹文档：

Step 2: Add an Apple Pay button to your site Start by adding a button to the HTML on your product page. Safari now >ships with built-in Apple Pay images; you can use them with Safari's ->webkit-named-image feature. This button should be hidden by default.

我认为这样做是为了在整个互联网上创建统一的风格。

CSS 函数 -webkit-named-image() 的规范是什么？

What are the specs for the CSS function -webkit-named-image()?

css

webkit

function