diff options
author | Jb Audras <audrasjb@gmail.com> | 2021-07-28 09:15:09 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2021-07-28 09:15:09 +0200 |
commit | 78845340c825b921d65ff3e2e8a1c8864e31fc83 (patch) | |
tree | 510772dee5aa6cf9d7a7fc93b27cb6f1e938f68a /files/fr/web/css | |
parent | fc88b7ba78952c02c7b9f24eb3b9e6c9fceed9fb (diff) | |
download | translated-content-78845340c825b921d65ff3e2e8a1c8864e31fc83.tar.gz translated-content-78845340c825b921d65ff3e2e8a1c8864e31fc83.tar.bz2 translated-content-78845340c825b921d65ff3e2e8a1c8864e31fc83.zip |
French translation for the `forced-color-adjust` CSS property reference (#1745)
* Initial translation
* Fix glossary issue
* Remove unwanted dot
Diffstat (limited to 'files/fr/web/css')
-rw-r--r-- | files/fr/web/css/forced-color-adjust/index.html | 102 |
1 files changed, 102 insertions, 0 deletions
diff --git a/files/fr/web/css/forced-color-adjust/index.html b/files/fr/web/css/forced-color-adjust/index.html new file mode 100644 index 0000000000..2520c4fba1 --- /dev/null +++ b/files/fr/web/css/forced-color-adjust/index.html @@ -0,0 +1,102 @@ +--- +title: forced-color-adjust +slug: Web/CSS/forced-color-adjust +browser-compat: css.properties.forced-color-adjust +translation_of: 'Web/CSS/forced-color-adjust' +--- +<div>{{CSSRef}}</div> + +<p>La propriété CSS <strong><code>forced-color-adjust</code></strong> permet aux auteurs de ne pas activer les modes de couleurs forcées sur certains éléments. Cela restaure la possibilité de contrôler ces valeurs en CSS.</p> + +<h2 id="syntax">Syntaxe</h2> + +<pre class="brush: css">forced-color-adjust: auto; +forced-color-adjust: none; + +/* Valeurs globales */ +forced-color-adjust: inherit; +forced-color-adjust: initial; +forced-color-adjust: revert; +forced-color-adjust: unset;</pre> + +<p>La valeur de la propriété <code>forced-color-adjust</code> doit être l'un des mots-clés suivants.</p> + +<h3 id="values">Valeurs</h3> + +<dl> + <dt><code>auto</code></dt> + <dd>En mode de couleurs forcées, les couleurs de l'élément sont définies par l'{{Glossary("user agent", "agent utilisateur")}}. C'est la valeur par défaut.</dd> + <dt><code><strong>none</strong></code></dt> + <dd>Même en mode de couleurs forcées, les couleurs de l'élément ne sont pas automatiquement définies par l'{{Glossary("user agent", "agent utilisateur")}}.</dd> +</dl> + +<h2 id="usage_notes">Notes d'utilisation</h2> + +<p>Cette propriété ne devrait être utilisée que pour faire des modifications qui prendront en charge les pré-requis de couleurs et de contrastes. Par exemple, si vous savez que les optimisations de couleur faites par l'{{Glossary("user agent", "agent utilisateur")}} conduisent à une mauvaise expérience en mode contrasté ou en mode sombre. L'utilisation de cette propriété vous permettra alors de modifier le résultat dans ce mode pour proposer une meilleure expérience. <strong>Elle ne devrait pas être utilisée dans le but d'empêcher les choix de l'utilisateur d'être respectés</strong>.</p> + +<p>Cette propriété est une version standard de la propriété <a href="https://docs.microsoft.com/en-us/previous-versions/hh771863%28v%3dvs.85%29"><code>-ms-high-contrast-adjust</code> (en anglais)</a>. La propriété préfixée peut être utilisée pour obtenir un résultat similaire sur Internet Explorer 10 et sur les versions EdgeHTML de Microsoft Edge.</p> + +<h2 id="formal_definition">Définition formelle</h2> + +<p>{{cssinfo}}</p> + +<h2 id="formal_syntax">Syntaxe formelle</h2> + +<p>{{csssyntax}}</p> + +<h2 id="examples">Exemples</h2> + +<h3 id="preserving_colors">Préserver les couleurs</h3> + +<p>Dans l'exemple ci-dessous, la première boîte utilise le jeu de couleur définit par l'utilisateur. Par exemple, dans le mode à forts contrastes sombre de Windows, cela donnera du texte blanc sur fond noir. La seconde boîte conservera quant à elle les couleurs du site définies par la classe <code>.box</code>.</p> + +<p>En utilisant la fonctionnalité média <code><a href="/fr/docs/Web/CSS/@media/forced-colors">forced-colors</a></code>, vous pouvez ajouter n'importe qu'elle autre optimisation pour le mode de couleurs forcées aux côtés de la propriété <code>forced-color-adjust</code>.</p> + +<h4 id="css">CSS</h4> + +<pre class="brush: css">.box { + border: 5px solid grey; + background-color: #ccc; + width: 300px; + margin: 20px; + padding: 10px; +} + +@media (forced-colors: active) { + .forced { + forced-color-adjust: none; + } +}</pre> + +<h4 id="html">HTML</h4> + +<pre class="brush: html"><div class="box"> + <p>Voici une boîte qui utilisera vos préférences de couleurs.</p> +</div> + +<div class="box forced"> + <p>Voici une boîte qui conservera les couleurs définies par le site.</p> +</div></pre> + +<h4 id="result">Résultat</h4> + +<p>{{EmbedLiveSample("preserving_colors", 640, 260)}}</p> + +<figure role="figure" aria-label="L'exemple présenté ci-dessus restitué dans le mode de contrastes forts de Windows"><img src="windows-high-contrast.jpg" alt="L'exemple présenté ci-dessus affiche la première boîte avec un arrière-plan noir et la seconde avec un arrière-plan gris définit en CSS."> +<figcaption>L'exemple ci-dessus restitué dans le mode de contrastes forts de Windows</figcaption></figure> + +<h2 id="specifications">Spécifications</h2> + +<p>{{Specifications}}</p> + +<h2 id="browser_compatibility">Compatibilité des navigateurs</h2> + +<p>{{Compat}}</p> + +<h2 id="see_also">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/Web/HTML/Applying_color">Appliquer des couleurs sur des éléments HTML grâce à CSS</a></li> + <li><a href="https://blogs.windows.com/msedgedev/2020/09/17/styling-for-windows-high-contrast-with-new-standards-for-forced-colors/"><i lang="en">Styling for Windows high contrast with standards for forced colors</i> (en anglais)</a></li> + <li>{{cssxref("color-adjust")}}</li> +</ul> |