Safari中不支持css运动路径.我曾try 使用css支持规则来定位偏移量路径,但它不起作用.

if (CSS.supports("offset-path", "M0.5 1H1549.5")) {
   console.log("supported yay");
   // Motion path is not supported, apply fallback styles or alternative actions
   //   element.style.transform = "translateX(100px)";
} else {
   console.log("not supported");
}

我try 了这个逻辑,但它在Chrome浏览器中不起作用.我做错了什么?

推荐答案

chromium 浏览器do支持具有path()个值的offset-path属性.

但是CSS.supports()需要正确的值语法,否则,它将返回FALSE.没有中间结果,即结果显示为"It supports the value but the syntax is incorrect".

因此,只需使用正确的值,如下所示:

if (CSS.supports("offset-path", `path("M0.5 1H1549.5")`)) {
...

Css相关问答推荐

在react native中应用阴影

搜索栏突出显示角形HTML中的Mat-Form-field输入框的焦点

无限交替css动画之间的未知延迟

本机CSS嵌套混乱

如何在 CSS 中使 Flex 容器内的网格响应,而不 destruct 外部 Flex 容器的布局?

.NET 8 预览版 6 中不使用新项目模板提供 Blazor CSS 文件

在 Shiny 中动态更改 bslib 值框的类

:not() 适用于特定类中的所有 html 标签

使用 CSS 定位悬停/弹出 div - 字形浏览器网页

我在 ins 标签中有一个 img 标签,更改 ins 格式覆盖图像的视图

Bootstrap 类似乎没有任何作用

从 Angular SCSS 生成 CSS?

使用 CSS 在悬停时转换 SVG 路径的填充属性

firefox overflow-y 不能使用嵌套的 flexbox

BEM 块、命名和嵌套

什么是 ::content/::slotted 伪元素,它是如何工作的?

使用 CSS/HTML 更改悬停图像

Angular 5 在某些类中添加了ng-star-inserted - 那是什么?

我应该如何组织我的 CSS 文件的内容?

仅使用 css 的换行符(如
)