2015-10-15 86 views
0

我想爲safari提供不同的CSS。因爲我的代碼在Chrome和Firefox中完美運行。但它破壞了Safari瀏覽器的結構。所以,我想爲safari提供不同的樣式表。 我已經嘗試過,我該如何爲Safari瀏覽器提供不同的CSS

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

這只是一個例子,但有這麼多的事情,這在野生動物園打破。

+0

你可以檢查這個答案的澄清細節 - http://stackoverflow.com/questions/16348489/is-there-a-css-hack-for-safari-onl y-not-chrome –

+1

您可以通過php或Javascript檢查瀏覽器,然後如果它是Safari,請爲該元素添加一個類併爲其添加額外的樣式。 – Mossen

+0

Safari不應該給這麼多問題。您是否正在測試Safari for Windows?這是一個多年來一直未得到支持的死瀏覽器,並且存在安全漏洞。你應該鼓勵人們停止使用它。 – Quentin

回答

0

您可以使用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 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

0

我同意rajveer家蠶,試試這個代碼

<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>