diff options
author | julieng <julien.gattelier@gmail.com> | 2021-10-02 17:20:14 +0200 |
---|---|---|
committer | SphinxKnight <SphinxKnight@users.noreply.github.com> | 2021-10-02 17:30:20 +0200 |
commit | c05efa8d7ae464235cf83d7c0956e42dc6974103 (patch) | |
tree | 6ea911b2f2010f63a026de6bb7a1a51e7690a7e1 /files/fr/web/api/window/getcomputedstyle/index.html | |
parent | 13a5e017558b248ee1647d4a5825f183b51f09ad (diff) | |
download | translated-content-c05efa8d7ae464235cf83d7c0956e42dc6974103.tar.gz translated-content-c05efa8d7ae464235cf83d7c0956e42dc6974103.tar.bz2 translated-content-c05efa8d7ae464235cf83d7c0956e42dc6974103.zip |
move *.html to *.md
Diffstat (limited to 'files/fr/web/api/window/getcomputedstyle/index.html')
-rw-r--r-- | files/fr/web/api/window/getcomputedstyle/index.html | 116 |
1 files changed, 0 insertions, 116 deletions
diff --git a/files/fr/web/api/window/getcomputedstyle/index.html b/files/fr/web/api/window/getcomputedstyle/index.html deleted file mode 100644 index 2c4294f100..0000000000 --- a/files/fr/web/api/window/getcomputedstyle/index.html +++ /dev/null @@ -1,116 +0,0 @@ ---- -title: window.getComputedStyle -slug: Web/API/Window/getComputedStyle -translation_of: Web/API/Window/getComputedStyle ---- -<p>{{ ApiRef() }}</p> - -<h2 id="Résumé">Résumé</h2> - -<p><code>La méthode window.getComputedStyle() </code>donne la <a href="/en/CSS/used_value">valeur calculée finale</a> de toutes les propriétés CSS sur un élément.</p> - -<h2 id="Syntaxe">Syntaxe</h2> - -<pre class="eval">var <em>style</em> = window.getComputedStyle(<em>element</em>[, <em>pseudoElt</em>]);</pre> - -<dl> - <dt>element</dt> - <dd>L’{{ domxref("Element") }} pour lequel vous voulez obtenir une valeur calculée.</dd> - <dt>pseudoElt {{ optional_inline() }}</dt> - <dd>Chaîne de caractère spécifiant le pseudo-élément à cibler. Doit être <code>null</code> (ou non spécifiée) pour les éléments communs.</dd> -</dl> - -<div class="note"> - <p><strong>Note :</strong> Avant Gecko 2.0 {{ geckoRelease("2.0") }}, le paramètre <code>pseudoElt</code> était obligatoire. Aucun autre navigateur majeur ne requiert que ce paramètre soit renseigné si il est null. Gecko a été modifié pour se comporter comme les autres navigateurs.</p> -</div> - -<p>La valeur de retour <code>style</code> est un objet <a href="/en/DOM/CSSStyleDeclaration"><code>CSSStyleDeclaration</code></a>.</p> - -<h2 id="Exemple">Exemple</h2> - -<pre class="brush: js">var elem1 = document.getElementById("elemId"); -var style = window.getComputedStyle(elem1, null); - -// Ce qui équivaut à : -// var style = document.defaultView.getComputedStyle(elem1, null); -</pre> - -<pre class="brush: html"><style> - #elem-container{ - position: absolute; - left: 100px; - top: 200px; - height: 100px; - } -</style> - -<div id="elem-container">dummy</div> -<div id="output"></div> - -<script> - function getTheStyle(){ - var elem = document.getElementById("elem-container"); - var theCSSprop = window.getComputedStyle(elem,null).getPropertyValue("height"); - document.getElementById("output").innerHTML = theCSSprop; - } - getTheStyle(); -</script> -</pre> - -<pre class="brush: js">function dumpComputedStyles(elem,prop) { - - var cs = window.getComputedStyle(elem,null); - if (prop) { - console.log(prop+" : "+cs.getPropertyValue(prop)); - return; - } - var len = cs.length; - for (var i=0;i<len;i++) { - - var style = cs[i]; - console.log(style+" : "+cs.getPropertyValue(style)); - } - -}</pre> - -<h2 id="Description">Description</h2> - -<p>L'objet retourné est du même type que celui de la propriété {{domxref("HTMLElement.style", "style")}} de l'élément ciblé. Toutefois les deux objets ont des buts distincts. L'objet retourné par la méthode <code>getComputedStyle</code> est en lecture seule et peut être utilisée pour inspecter le style de l'élément y compris ceux ajoutés via un élément <code><style></code> ou une feuille de style externe. L'objet <code>elt.style</code> doit quant à lui être utilisé pour mettre à jour une propriété de style sur un élément donné.</p> - -<p>Le premier argument doit être un Element, sinon, si par exemple un #text Node est utilisé, une exception sera lancée. Depuis la version 1.9.2 de Gecko {{geckoRelease("1.9.2")}}, les URLs renvoyées ont désormais des guillemets autour de celles-ci: <code>url("http://foo.com/bar.jpg")</code>.</p> - -<h2 id="Specification">Spécification</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Spécification</th> - <th scope="col">Statut</th> - <th scope="col">Commentaire</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName("CSSOM", "#dom-window-getcomputedstyle", "getComputedStyle()")}}</td> - <td>{{Spec2("CSSOM")}}</td> - <td></td> - </tr> - <tr> - <td>{{SpecName("DOM2 Style", "#CSS-CSSview-getComputedStyle", - "getComputedStyle()")}}</td> - <td>{{Spec2("DOM2 Style")}}</td> - <td>Définition initiale.</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> - -<p>{{Compat("api.Window.getComputedStyle")}}</p> - -<h2 id="See_also">Voir aussi</h2> - -<ul> - <li>{{domxref("window.getDefaultComputedStyle")}}</li> - <li>{{cssxref("resolved_value", "Valeur résolue")}}</li> -</ul> |