Exemplu
Adăugați o culoare roșie la <h1> Element:
document.getElementById("myH1").style.color = "red";
Înainte de a seta stilul:
Hello World!
După setarea stilului:
Hello World!
Încearcă - l singur » Mai multe "Try it Yourself" - "Try it Yourself" exemplele de mai jos.
Definiție și utilizare
Proprietatea stil returnează un obiect CSSStyleDeclaration, ceea ce reprezintă atributul stilul unui element.
Proprietatea stil este folosit pentru a obține sau pentru a seta un stil specific al unui element folosind diferite proprietăți CSS.
Notă: Nu este posibil să se stabilească stiluri prin atribuirea unui șir de caractere în proprietate stil, de exemplu , elementul .style = "color: red;" . Pentru a seta stilul unui element, adăugați un "CSS" proprietate stil și specificați o valoare, ca aceasta:
element .style.backgroundColor = "red"; // set the background color of an element to red Try it
După cum puteți vedea, sintaxa JavaScript pentru setarea proprietăților CSS este ușor diferită decât CSS (backgroundColor instead of background-color) în (backgroundColor instead of background-color) de (backgroundColor instead of background-color) .
Pentru o listă a tuturor proprietăților disponibile, vezi de referință Stil obiect .
Notă: Proprietatea stil returnează numai declarațiile CSS stabilite în linie atribut stilul elementului, de exemplu ,
<P style = "color: red;">. Nu este posibil să se utilizeze această proprietate pentru a obține informații cu privire la regulile de stil din <head> secțiunea în document sau foi de stil externe.
Cu toate acestea, puteți accesa <style> elementul din <head> , prin utilizarea de documente. getElementsByTagName() :
var x = document.getElementsByTagName("STYLE")[0]; // get the first
<style> element Try it
Notă: Se recomandă să utilizați proprietatea de stil în loc de element . setAttribute("style", "...") metodă, pentru că proprietatea nu va suprascrie stilul de alte proprietăți CSS , care pot fi specificate în style atribut.
Suport pentru browser-
Proprietate | |||||
---|---|---|---|---|---|
style | da | da | da | da | da |
Sintaxă
Întoarcere proprietăți de stil:
element .style. property
Proprietăți stil Set:
element .style. property = value
Valori de proprietate
Valoare | Descriere |
---|---|
value | Specifică valoarea proprietății specificate. De exemplu, pentru proprietatea borderBottom: Element .style.borderBottom = "red solid 2px"; |
Detalii tehnice
Întoarcere Valoare: | Un obiect CSSStyleDeclaration, reprezentând atributul stilul unui element |
---|---|
DOM Versiunea | Dom Level 2 CSS |
Mai multe exemple
Exemplu
Ia valoarea unui <p> top-frontieră elementului:
var x = document.getElementById("myP").style.borderTop;
Rezultatul x va fi:
5px solid red
Încearcă - l singur » Pagini similare
CSS Tutorial: CSS Tutorial
CSS Referință: Proprietăți CSS
HTML DOM Reference: Stil obiect de referință
HTML de referință: HTML <style> tag
<Element Object