如何为 Safari 编写 CSS 条件规则？答案

【问题标题】：How to write CSS Conditional Rules for Safari?如何为 Safari 编写 CSS 条件规则？
【发布时间】：2015-09-30 18:42:37
【问题描述】：

您好，我在 IOS 的 mozilla、explorer、safari 和 chrome 中的“边距”有些问题。

对于 Mozilla 和 Explorer 我解决了

/*Styles for Firefox*/
@-moz-document url-prefix() {
    .box img {
        width: 100%;
    }

.box .info{
    margin-left: -70% !important;}
}

/* Styles for IE10*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .box img {
        width: 100%;
    }

    .box .info{
   margin-left: -70% !important;}
}

Safari 呢？

【问题讨论】：

正是您想要实现的目标，您的代码不足以理解问题。
前几天我碰巧遇到了这件事-可能有用stackoverflow.com/questions/23300412/…
@vivekkupadhyay 我需要在 CSS 中调用一些规则，仅适用于 Safari 桌面、iOS 移动设备上的 Chrome 和 IOS 移动设备上的 Safari。
@Mickm It 您的建议适用于“Safari 桌面”，但移动设备上的 Safari 和 IOS 移动设备上的 Chrome 仍然存在这个问题。你有什么建议吗？谢谢

标签： html css cross-browser

【解决方案1】：

应该适用于 Safari 6.1+，修改你的样式以适应：

@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0) { @media
{
    .box img {
        width: 100%;
    }

.box .info{
    margin-left: -70% !important;
    }
}}

【讨论】：