From 258ba7b4be62d8640477a3bd3146d08b00cb70ec Mon Sep 17 00:00:00 2001 From: julieng Date: Fri, 17 Sep 2021 20:59:20 +0200 Subject: convert content to md --- .../css/@media/-webkit-device-pixel-ratio/index.md | 117 +++++++++------------ 1 file changed, 49 insertions(+), 68 deletions(-) (limited to 'files/fr/web/css/@media/-webkit-device-pixel-ratio') diff --git a/files/fr/web/css/@media/-webkit-device-pixel-ratio/index.md b/files/fr/web/css/@media/-webkit-device-pixel-ratio/index.md index 3d96ba5464..023c96d1d2 100644 --- a/files/fr/web/css/@media/-webkit-device-pixel-ratio/index.md +++ b/files/fr/web/css/@media/-webkit-device-pixel-ratio/index.md @@ -8,30 +8,27 @@ tags: - Reference translation_of: Web/CSS/@media/-webkit-device-pixel-ratio --- -
{{CSSRef}}{{Non-standard_header}}
+{{CSSRef}}{{Non-standard_header}} -

-webkit-device-pixel-ratio est une caractéristique média non-standard, alternative à la caractéristique média standard {{cssxref("@media/resolution","resolution")}}.

+**`-webkit-device-pixel-ratio`** est une caractéristique média non-standard, alternative à la caractéristique média standard {{cssxref("@media/resolution","resolution")}}. -

Sa valeur correspond au nombre de pixels physiques utilisés par l'appareil pour représenter un pixel CSS (px). Bien que la valeur soit de type {{cssxref("<number>")}}, sans unité donc, l'unité implicite est dppx.

+Sa valeur correspond au nombre de pixels physiques utilisés par l'appareil pour représenter [un pixel CSS (`px`)](/fr/docs/Web/CSS/length#unités_de_longueur_absolues). Bien que la valeur soit de type {{cssxref("<number>")}}, sans unité donc, l'unité implicite est [`dppx`](/fr/docs/Web/CSS/resolution#unités). -
-

Attention : Cette caractéristique est spécifique à WebKit. Tant que possible, on utilisera {{cssxref("@media/resolution","resolution")}}.

-
+> **Attention :** Cette caractéristique est spécifique à WebKit. Tant que possible, on utilisera {{cssxref("@media/resolution","resolution")}}. -

Syntaxe

+## Syntaxe -

-webkit-device-pixel-ratio est une valleur décrivant un intervalle. On peut également utiliser -webkit-min-device-pixel-ratio et -webkit-max-device-pixel-ratio pour fixer un seuil minimum/maximum.

+**`-webkit-device-pixel-ratio`** est une valleur décrivant un intervalle. On peut également utiliser **`-webkit-min-device-pixel-ratio`** et **`-webkit-max-device-pixel-ratio`** pour fixer un seuil minimum/maximum. -

Valeurs

+### Valeurs -
-
{{cssxref("<number>")}}
-
Le nombre de pixels physiques pour chaque pixel (px) CSS. Bien que la valeur soit un nombre et ne permette pas d'utiliser des unités, l'unité implicite est dppx.
-
+- {{cssxref("<number>")}} + - : Le nombre de pixels physiques pour chaque pixel ([`px`](/fr/docs/Web/CSS/length#unités_de_longueur_absolues)) CSS. Bien que la valeur soit un nombre et ne permette pas d'utiliser des unités, l'unité implicite est [`dppx`](/fr/docs/Web/CSS/resolution#dppx). -

Implémentation

+## Implémentation -
/* Unité dppx implicite */
+```css
+/* Unité dppx implicite */
 @media (-webkit-min-device-pixel-ratio: 2) { ... }
 /* équivalent à */
 @media (min-resolution: 2dppx) { ... }
@@ -40,13 +37,14 @@ translation_of: Web/CSS/@media/-webkit-device-pixel-ratio
 @media (-webkit-max-device-pixel-ratio: 2) { ... }
 /* équivalent à */
 @media (max-resolution: 2dppx) { ... }
-
+``` -

Exemples

+## Exemples -

CSS

+### CSS -
/* Résolution exacte */
+```css
+/* Résolution exacte */
 @media (-webkit-device-pixel-ratio: 1) {
   p {
     color: red;
@@ -65,52 +63,35 @@ translation_of: Web/CSS/@media/-webkit-device-pixel-ratio
   p {
     background: yellow;
   }
-}
- -

HTML

- -
<p>Voici un test pour la densité de pixel de votre appareil.</p>
-
- -

Résultat

- -

{{EmbedLiveSample("Exemples")}}

- -

Spécifications

- - - - - - - - - - - - - - - - - - - - - -
SpécificationÉtatCommentaires
{{SpecName('Compat', '#css-media-queries-webkit-device-pixel-ratio', '-webkit-device-pixel-ratio')}}{{Spec2('Compat')}}Définition initiale dans un standard.
Safari CSS Reference 'media query extensions'.Documentation non-officielle, non-standard.Documentation initiale.
- -

Compatibilité des navigateurs

- -

{{Compat("css.at-rules.media.-webkit-device-pixel-ratio")}}

- -

Voir aussi

- - +} +``` + +### HTML + +```html +

Voici un test pour la densité de pixel de votre appareil.

+``` + +### Résultat + +{{EmbedLiveSample("Exemples")}} + +## Spécifications + +| Spécification | État | Commentaires | +| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------- | ------------------------------------- | +| {{SpecName('Compat', '#css-media-queries-webkit-device-pixel-ratio', '-webkit-device-pixel-ratio')}} | {{Spec2('Compat')}} | Définition initiale dans un standard. | +| [Safari CSS Reference 'media query extensions'.](https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariCSSRef/Articles/OtherStandardCSS3Features.html#//apple_ref/doc/uid/TP40007601-SW3) | Documentation non-officielle, non-standard. | Documentation initiale. | + +## Compatibilité des navigateurs + +{{Compat("css.at-rules.media.-webkit-device-pixel-ratio")}} + +## Voir aussi + +- {{cssxref("@media/resolution","resolution")}} +- {{cssxref("-webkit-transition")}} +- {{cssxref("-webkit-transform-3d")}} +- {{cssxref("-webkit-transform-2d")}} +- {{cssxref("-webkit-animation")}} +- [Article du W3C pour éviter le préfixe](https://www.w3.org/blog/CSS/2012/06/14/unprefix-webkit-device-pixel-ratio/) -- cgit v1.2.3-54-g00ecf