css - 你如何只为移动设备上的 safari 更改 css

Question

我正在尝试使用一个仅对 ios 上的 safari 浏览器有效的类，但不幸的是它也适用于 ios 上的 firefox。

我试过这些解决方案：

@media not all and (min-resolution:.001dpcm)
{ @supports (-webkit-appearance:none) and (stroke-color:transparent) {
    .safari-only {
       height: 85vh;
   }
}}

_::-webkit-full-page-media, _:future, :root .safari-only {
  height: 85vh;
}

@supports (-webkit-touch-callout: none) {
    .safari-only {
        height: 85vh;
    }
}

但它们也都被应用到了火狐浏览器中

标签： cssvue.jssass

Answer 1

你试过这个吗？

@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0)
{ @media {
    /*
      Safari style
     */
}}