Maison >interface Web >tutoriel CSS >Comment puis-je cibler spécifiquement Safari avec CSS ?

Comment puis-je cibler spécifiquement Safari avec CSS ?

Susan Sarandon
Susan Sarandonoriginal
2024-12-26 16:28:09538parcourir

How Can I Specifically Target Safari with CSS?

Isoler les styles dans Safari

Bien qu'isoler les CSS dans Safari puisse sembler possible, la plupart des méthodes s'appliquent également à Chrome en raison de leur base WebKit partagée.

Safari efficace et spécifique Hacks

Pour cibler exclusivement Safari, pensez à ces hacks CSS :

Safari 7.1 :

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

Safari 10.1 :

/* Double media query is crucial */
@media not all and (min-resolution: .001dpcm) {
  @media {
    .safari_only {
      color: #0000FF;
      background-color: #CCCCCC;
    }
  }
}

Safari 6.1-10.0 :

@media screen and (min-color-index: 0) and (-webkit-min-device-pixel-ratio: 0) {
  @media {
    .safari_only {
      color: #0000FF;
      background-color: #CCCCCC;
    }
  }
}

Utilisation :

Appliquez ces règles CSS à une classe nommée "safari_only" pour cibler uniquement les navigateurs Safari. Par exemple :

<div>

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