Maison >interface Web >tutoriel CSS >Comment puis-je appliquer des hacks CSS pour cibler spécifiquement différentes versions de Safari ?

Comment puis-je appliquer des hacks CSS pour cibler spécifiquement différentes versions de Safari ?

Patricia Arquette
Patricia Arquetteoriginal
2024-12-24 20:15:12210parcourir

How Can I Apply CSS Hacks to Specifically Target Different Safari Versions?

Piratage CSS spécifique à Safari

Bien que le code fourni n'ait pas réussi à différencier Safari de Chrome, des hacks CSS alternatifs sont disponibles qui ciblent exclusivement les versions de Safari 6.1 et supérieur. Voici un de ces hacks :

_::-webkit-full-page-media, _:future, :root .safari_only {
  color: #0000FF;
  background-color: #CCCCCC;
}

Hacks Safari spécifiques à la version

Pour les versions Safari 10.1 et supérieures, utilisez ce hack :

/* Safari 10.1+ */
@media not all and (min-resolution: .001dpcm) {
  @media {
    .safari_only {
      color: #0000FF;
      background-color: #CCCCCC;
    }
  }
}

Pour les versions Safari 6.1 à 10.0, utilisez ceci hack :

/* Safari 6.1-10.0 (not 10.1) */
@media screen and (min-color-index: 0) and (-webkit-min-device-pixel-ratio: 0) {
  @media {
    .safari_only {
      color: #0000FF;
      background-color: #CCCCCC;
    }
  }
}

Pour appliquer ces hacks, ajoutez une classe nommée "safari_only" aux éléments que vous souhaitez styliser pour Safari uniquement.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent:Aide-mémoire CSS TailwindArticle suivant:Aide-mémoire CSS Tailwind