如何为safari浏览器提供不同的CSS

时间:2015-10-15 05:40:43

标签: html css safari cross-browser

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

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

这只是一个例子,但有太多的东西,在野生动物园中突破。

2 个答案:

答案 0 :(得分:1)

我同意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>

答案 1 :(得分:0)

您可以使用jQuery专门定位Safari,并根据需要加载备用CSS或完全不同的样式表:

&#13;
&#13;
if (navigator.userAgent.indexOf('Safari') != -1 && navigator.userAgent.indexOf('Chrome') == -1){
  // do something for Safari only
} else {
  // do something else in all other browsers
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
&#13;
&#13;
&#13;