--- title: element.style slug: Web/API/Element/style tags: - DOM - Dokumentacja_Gecko_DOM - Gecko - Strony_wymagające_dopracowania - Wszystkie_kategorie translation_of: Web/API/ElementCSSInlineStyle/style ---
{{ ApiRef("DOM") }}
Zwraca obiekt reprezentujący atrybut style
elementu.
var div = document.getElementById("div1"); div.style.marginTop = ".25in";
Ponieważ własność style
reprezentuje atrybut style
, który ma najwyższy priorytet w kaskadzie CSS, własność ta jest użyteczna by ustawić styl określonego elementu. Nie przyda się jednak do sprawdzania stylu elementu, ponieważ zależy ona tylko od atrybutu style
, a nie od reguł stylów określonych gdziekolwiek indziej. Możesz użyć window.getComputedStyle
, by sprawdzić styl elementu.
Zobacz listę własności CSS dostępnych w DOM, gdzie znajdziesz też dodatkowe uwagi o zastosowaniu własności style
.
Ogólnie rzecz biorąc, lepiej jest użyć własność style
zamiast elt.setAttribute('style', '...')
, ponieważ użycie style
nie nadpisze innych własności CSS, które mogły być wcześniej określone atrybutem style
.
Styli nie można ustawiać poprzez przekazywania łańcucha znaków do atrybutu style
(tylko odczyt), np. elt.style = "color: blue;"
. Jest to niemożliwe ponieważ atrybut stylu zwraca obiekt CSSStyleDeclaration
. Zamiast tego, możesz ustawić poszczególne własności atrybutu style
w ten sposób:
elt.style.color = "blue"; // Directly var st = elt.style; st.color = "blue"; // Indirectly
Poniższy kod wyświetli nazwy wszystkich własności stylu, wartości ustawione dla elementu elt
oraz dziedziczone 'przeliczone'' wartości:
var elt = document.getElementById("elementIdHere"); var out = ""; var st = elt.style; var cs = window.getComputedStyle(z, null); for (x in st) out += " " + x + " = '" + st[x] + "' > '" + cs[x] + "'\n";