如何为 safari 浏览器提供不同的 css答案

【问题标题】：how can I give different css for safari browser如何为 safari 浏览器提供不同的 css
【发布时间】：2016-01-13 10:46:23
【问题描述】：

我想为 safari 提供不同的 CSS。因为我的代码在 chrome 和 Firefox 中完美运行。但它破坏了野生动物园的结构。所以，我想为 safari 提供不同的样式表。我已经试过了，

button{
       margin: 0px 10px 0px 0px /* Safari */;
       margin: 0px 10px 0px 20px /* chrome */;
}

这只是一个例子，但有很多东西在 safari 中被打破。

【问题讨论】：

您可以查看此答案以了解详细信息 - stackoverflow.com/questions/16348489/…
您可以通过 php 或 Javascript 检查浏览器，如果是 Safari，则为元素添加一个类并赋予其额外的样式。
Safari 应该不会有那么多问题。您正在测试 Windows 版 Safari 吗？那是一个死掉的浏览器，多年来一直没有得到支持，并且充满了安全漏洞。您应该鼓励人们停止使用它。

标签： html css safari cross-browser

【解决方案1】：

您可以使用 jQuery 专门针对 Safari，并根据需要加载备用 CSS 或完全不同的样式表：

if (navigator.userAgent.indexOf('Safari') != -1 && navigator.userAgent.indexOf('Chrome') == -1){
  // do something for Safari only
} else {
  // do something else in all other browsers
}

&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;

【讨论】：

【解决方案2】：

我同意 rajveer mori，试试这个代码

 <head>
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
        <style type="text/css">audio {display: none;}</style>
    </head>
    <body>
    <ul id="nav-two" class="nav">
        <li>
            <a href="#">Home</a>
            <audio id="sound" controls preload="auto"><source src="http://soundbible.com/mp3/MP5_SMG-GunGuru-703432894.mp3" controls></source></audio>
        </li>
        <li><a href="#">About</a></li>
        <li><a href="#">Clients</a></li>
        <li><a href="#">Contact Us</a></li>
    </ul>
    <script>
    $("#nav-two a")
      .each(function(i) {
        if (i != 0) {
          $("#sound")
            .clone()
            .attr("id", "sound" + i)
            .appendTo($(this).parent());
        }
        $(this).data("beep", i);
      })
      .mouseenter(function() {
        $("#sound" + $(this).data("beep"))[0].play();
      });
    $("#sound").attr("id", "sound0");
    </script>
    </body>

【讨论】：