diff options
author | julieng <julien.gattelier@gmail.com> | 2021-09-17 20:59:20 +0200 |
---|---|---|
committer | SphinxKnight <SphinxKnight@users.noreply.github.com> | 2021-10-12 07:57:33 +0200 |
commit | 258ba7b4be62d8640477a3bd3146d08b00cb70ec (patch) | |
tree | a8476eee4c369ff47bdfe08353774414f2281ba3 /files/fr/web/css/alpha-value | |
parent | 149319bb8c7b1394a443f0877c3460cd362aa815 (diff) | |
download | translated-content-258ba7b4be62d8640477a3bd3146d08b00cb70ec.tar.gz translated-content-258ba7b4be62d8640477a3bd3146d08b00cb70ec.tar.bz2 translated-content-258ba7b4be62d8640477a3bd3146d08b00cb70ec.zip |
convert content to md
Diffstat (limited to 'files/fr/web/css/alpha-value')
-rw-r--r-- | files/fr/web/css/alpha-value/index.md | 59 |
1 files changed, 21 insertions, 38 deletions
diff --git a/files/fr/web/css/alpha-value/index.md b/files/fr/web/css/alpha-value/index.md index a2736fad98..f7d89bfd2a 100644 --- a/files/fr/web/css/alpha-value/index.md +++ b/files/fr/web/css/alpha-value/index.md @@ -7,56 +7,39 @@ tags: - Type de donnée translation_of: Web/CSS/alpha-value --- -<p>{{CSSRef}}{{draft()}}</p> +{{CSSRef}}{{draft()}} -<p>Le <a href="/fr/docs/Web/CSS/Types_CSS">type de donnée</a> CSS <strong><code><alpha-value></code></strong> représente une valeur qui peut être un nombre ({{cssxref("<number>")}}) ou un pourcentage ({{cssxref("<percentage>")}}) et qui indique le <a href="https://fr.wikipedia.org/wiki/Canal_alpha">canal alpha</a> ou <em>l'opacité</em> d'une couleur.</p> +Le [type de donnée](/fr/docs/Web/CSS/Types_CSS) CSS **`<alpha-value>`** représente une valeur qui peut être un nombre ({{cssxref("<number>")}}) ou un pourcentage ({{cssxref("<percentage>")}}) et qui indique le [canal alpha](https://fr.wikipedia.org/wiki/Canal_alpha) ou _l'opacité_ d'une couleur. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<p>Si la valeur est fournie comme un nombre, la valeur peut être comprise entre 0 (complètement transparent) et 1 (complètement opaque). Il est possible d'utiliser des valeurs décimales comprises entre ces valeurs. Les valeurs à l'extérieur de cet intervalle sont valides mais elles sont écrétées à 0 ou 1.</p> +Si la valeur est fournie comme un nombre, la valeur peut être comprise entre 0 (complètement transparent) et 1 (complètement opaque). Il est possible d'utiliser des valeurs décimales comprises entre ces valeurs. Les valeurs à l'extérieur de cet intervalle sont valides mais elles sont écrétées à 0 ou 1. -<p>Lorsque la valeur est fournie en pourcentage 0% correspond à une transparence complète tandis que 100% correspond à une opacité totale.</p> +Lorsque la valeur est fournie en pourcentage 0% correspond à une transparence complète tandis que 100% correspond à une opacité totale. -<h2 id="Interpolation">Interpolation</h2> +## Interpolation -<p>Lorsqu'une animation fait évoluer une valeur de type <code><alpha-value></code>, les valeurs sont interpolées comme des nombres réels à point flottant. La vitesse de l'interpolation est déterminée par la <a href="/fr/docs/Web/CSS/timing-function">fonction de temporisation</a> associée à l'animation.</p> +Lorsqu'une animation fait évoluer une valeur de type `<alpha-value>`, les valeurs sont interpolées comme des nombres réels à point flottant. La vitesse de l'interpolation est déterminée par la [fonction de temporisation](/fr/docs/Web/CSS/timing-function) associée à l'animation. -<h2 id="Exemples">Exemples</h2> +## Exemples -<p>Certaines fonctionnalités CSS utilisent des valeurs <code><alpha-value></code> dont <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#RGB_colors">les notations fonctionnelles pour les couleurs telles que <code>rgba()</code> et <code>hsla()</code></a> et aussi {{cssxref("shape-image-threshold")}} (qui détermine les pixels à prendre en compte pour une image lorsqu'on souhaite en extraire une forme).</p> +Certaines fonctionnalités CSS utilisent des valeurs `<alpha-value>` dont [les notations fonctionnelles pour les couleurs telles que `rgba()` et `hsla()`](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#RGB_colors) et aussi {{cssxref("shape-image-threshold")}} (qui détermine les pixels à prendre en compte pour une image lorsqu'on souhaite en extraire une forme). -<pre class="brush: css"> -/* <rgba()> */ +```css +/* <rgba()> */ color: rgba(34, 12, 64, 0.6); color: rgba(34.0 12 64 / 60%); -</pre> +``` -<pre class="brush: css"> +```css /* shape-image-threshold */ shape-image-threshold: 70%; shape-image-threshold: 0.7; -</pre> - -<h2 id="Spécifications">Spécifications</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaires</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('CSS4 Colors', '#type-def-alpha-value', '<alpha-value>')}}</td> - <td>{{Spec2('CSS4 Colors')}}</td> - <td>Aucune modification significative.</td> - </tr> - <tr> - <td>{{SpecName('CSS3 Colors', '#alphavaluedt', '<alpha-value>')}}</td> - <td>{{Spec2('CSS3 Colors')}}</td> - <td>Introduit le type <code><alpha-value></code> ainsi que les notations fonctionnelles <code>rgba()</code> et <code>hsla()</code>.</td> - </tr> - </tbody> -</table> +``` + +## Spécifications + +| Spécification | État | Commentaires | +| ---------------------------------------------------------------------------------------------------- | -------------------------------- | ---------------------------------------------------------------------------------------------- | +| {{SpecName('CSS4 Colors', '#type-def-alpha-value', '<alpha-value>')}} | {{Spec2('CSS4 Colors')}} | Aucune modification significative. | +| {{SpecName('CSS3 Colors', '#alphavaluedt', '<alpha-value>')}} | {{Spec2('CSS3 Colors')}} | Introduit le type `<alpha-value>` ainsi que les notations fonctionnelles `rgba()` et `hsla()`. | |