是否有一种方法只对Safari应用样式?

我试图找到一种方法来应用CSS只是Safari，但我发现一切也适用于Chrome。我知道这些目前都是WebKit浏览器，但我有问题的div对齐在Chrome和Safari;它们的显示方式不同。

我一直在尝试使用这个，但它也会影响Chrome:

@media screen and (-webkit-min-device-pixel-ratio:0) { 
  #safari { display: block; } 
}

有人知道另外一个只适用于Safari的吗?

当前回答

嗨，我做了这个，它为我工作

@media(max-width: 1920px){
    @media not all and (min-resolution:.001dpcm) {

        .photo_row2 {
            margin-left: 5.5% !important;
        }
    }
}

@media(max-width: 1680px){
    @media not all and (min-resolution:.001dpcm) {

        .photo_row2 {
            margin-left: 15% !important;
        }

    }
}

@media(max-width: 1600px){
    @media not all and (min-resolution:.001dpcm) {

        .photo_row2 {
            margin-left: 18% !important;
        }

    }
}


@media (max-width: 1440px) {
@media not all and (min-resolution:.001dpcm) {

        .photo_row2 {
            margin-left: 24.5% !important;
        }

    }

}


@media (max-width: 1024px) {
@media not all and (min-resolution:.001dpcm) {
    @media {
        .photo_row2 {
            margin-left: -11% !important;
        }

    }

}

2018-03-30 08:49:55

其他回答

如果你正在寻找Safari特定的浏览器黑客

我试过了，对我有效(只适用于Safari)

@supports (-webkit-hyphens:none){
        @content
}
    
@media not all and (min-resolution:.001dpcm)
    { @supports (-webkit-appearance:none) and (stroke-color:transparent) {
            @content
    }
}

2022-03-24 08:19:34

最后，我使用了一点JavaScript来实现它:

if (navigator.vendor.startsWith('Apple'))
    document.documentElement.classList.add('on-apple');

然后在我的CSS目标苹果浏览器引擎的选择器将是:

.on-apple .my-class{
    ...
}

2019-02-06 21:53:30

如此:

@media not all and (min-resolution:.001dpcm) { 
  @media {
    /* your code for Safari Desktop & Mobile */
    body {
      background-color: red;
      color: blue;
    }
    /* end */
  }
}

2018-12-05 18:48:02

注意:如果只支持ios就足够了(如果你愿意牺牲Safari桌面)，那么这是可行的:

    @supports (-webkit-overflow-scrolling: touch) {
    /* CSS specific to iOS devices */ 
    }

2019-09-11 16:16:44

在(.myClass)中替换你的类

/*只支持Safari */ .myClass:没有(:根:根){ 在这里输入代码 }

2016-07-12 12:41:16

是否有一种方法只对Safari应用样式?

推荐文章

最新文章

标签