diff options
Diffstat (limited to 'files/fr/web/css/@media')
| -rw-r--r-- | files/fr/web/css/@media/forced-colors/index.md | 32 | ||||
| -rw-r--r-- | files/fr/web/css/@media/prefers-contrast/index.md | 28 | ||||
| -rw-r--r-- | files/fr/web/css/@media/prefers-reduced-motion/index.md | 9 |
3 files changed, 31 insertions, 38 deletions
diff --git a/files/fr/web/css/@media/forced-colors/index.md b/files/fr/web/css/@media/forced-colors/index.md index cc33f5cca5..7dfb25ece9 100644 --- a/files/fr/web/css/@media/forced-colors/index.md +++ b/files/fr/web/css/@media/forced-colors/index.md @@ -1,10 +1,6 @@ --- title: forced-colors slug: Web/CSS/@media/forced-colors -tags: - - CSS - - Caractéristique média - - Reference translation_of: Web/CSS/@media/forced-colors --- {{CSSRef}}{{SeeCompatTable}}{{draft}} @@ -30,21 +26,25 @@ Dans cet exemple, les couleurs utilisées par défaut sont exotiques voire illis ### HTML - <div class="colors">quelques couleurs étranges</div> +```html +<div class="colors">quelques couleurs étranges</div> +``` ### CSS - .colors { - background-color: red; - color: grey; - } - - @media (forced-colors: active) { - .colors { - background-color: white; - color: black; - } - } +```css +.colors { + background-color: red; + color: grey; +} + +@media (forced-colors: active) { + .colors { + background-color: white; + color: black; + } +} +``` ### Résultat diff --git a/files/fr/web/css/@media/prefers-contrast/index.md b/files/fr/web/css/@media/prefers-contrast/index.md index 16467d0867..33d90f2617 100644 --- a/files/fr/web/css/@media/prefers-contrast/index.md +++ b/files/fr/web/css/@media/prefers-contrast/index.md @@ -1,10 +1,6 @@ --- title: prefers-contrast slug: Web/CSS/@media/prefers-contrast -tags: - - CSS - - Caractéristique média - - Reference translation_of: Web/CSS/@media/prefers-contrast --- {{CSSRef}}{{SeeCompatTable}}{{draft}} @@ -30,19 +26,23 @@ Par défaut, cet exemple présente un contraste trop faible pour la lisibilité. ### HTML - <div class="contrast">Une boîte avec un contraste faible.</div> +```html +<div class="contrast">Une boîte avec un contraste faible.</div> +``` ### CSS - .contrast { - color: grey; - } - - @media (prefers-contrast: high) { - .contrast { - color: black; - } - } +```css +.contrast { + color: grey; +} + +@media (prefers-contrast: high) { + .contrast { + color: black; + } +} +``` ### Résultat diff --git a/files/fr/web/css/@media/prefers-reduced-motion/index.md b/files/fr/web/css/@media/prefers-reduced-motion/index.md index 602abf4761..6bd87e7c10 100644 --- a/files/fr/web/css/@media/prefers-reduced-motion/index.md +++ b/files/fr/web/css/@media/prefers-reduced-motion/index.md @@ -1,13 +1,6 @@ --- title: prefers-reduced-motion slug: Web/CSS/@media/prefers-reduced-motion -tags: - - '@media' - - Accessibility - - CSS - - Media Queries - - Reference - - media feature translation_of: Web/CSS/@media/prefers-reduced-motion --- {{CSSRef}} @@ -104,7 +97,7 @@ Cet exemple possède une animation désagréable qui sera exécutée à moins d' ### Résultat -{{EmbedLiveSample("example")}} +{{EmbedLiveSample("Exemple")}} ## Spécifications |
