aboutsummaryrefslogtreecommitdiff
path: root/files/fr/web/css
diff options
context:
space:
mode:
authorJb Audras <audrasjb@gmail.com>2021-07-28 09:15:09 +0200
committerGitHub <noreply@github.com>2021-07-28 09:15:09 +0200
commit78845340c825b921d65ff3e2e8a1c8864e31fc83 (patch)
tree510772dee5aa6cf9d7a7fc93b27cb6f1e938f68a /files/fr/web/css
parentfc88b7ba78952c02c7b9f24eb3b9e6c9fceed9fb (diff)
downloadtranslated-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.html102
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">&lt;div class="box"&gt;
+  &lt;p&gt;Voici une boîte qui utilisera vos préférences de couleurs.&lt;/p&gt;
+&lt;/div&gt;
+
+&lt;div class="box forced"&gt;
+  &lt;p&gt;Voici une boîte qui conservera les couleurs définies par le site.&lt;/p&gt;
+&lt;/div&gt;</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>