Style top eigenschap
- Previous page textTransform
- Next page transform
- Go back one level HTML DOM Style Object
Definitie en gebruik
top
Eigenschap instellen of retourneren van de toppositie van het geplaatste element.
Deze eigenschap definieert de toppositie van het element, inclusief de binnenste marge, scrollbalk, rand en marge.
Tip:De elementen die worden geplaatst zijn Positionseigenschap Stel in als:relative
,absolute
of fixed
.
Tip:Gebruik deze om de onderste positie van het geïdentificeerde element in te stellen of te retourneren: Bottom-eigenschap.
Zie ook:
CSS Tutorial:CSS positioning
CSS Referentiemanual:Top-eigenschap
Voorbeeld
Voorbeeld 1
Stel de toppositie van het <button>-element in:
document.getElementById("myBtn").style.top = "100px";
Voorbeeld 2
Gebruik negatieve waarden - stel de toppositie van het <div>-element in:
document.getElementById("myDiv").style.top = "-100px";
Voorbeeld 3
Retourneer de toppositie van het <div>-element:
alert(document.getElementById("myDiv").style.top);
Syntax
Retourneren van de top-eigenschap:
object.style.top
Instellen van de top-eigenschap:
object.style.top = "auto|length|%|initial|inherit"
Eigenschapswaarde
Waarde | Beschrijving |
---|---|
auto | Laat de browser de toppositie instellen. Standaard. |
length | Definieer de toppositie met een lengte-eenheid. Negatieve waarden zijn toegestaan. |
% | Stel de toppositie in als een percentage van de hoogte van het ouder element. |
initial | Stel deze eigenschap in op zijn standaardwaarde. Zie ook initial. |
inherit | Deze eigenschap erft van de ouder element. Zie ook inherit. |
Technische details
Standaardwaarde: | Geen |
---|---|
Retourwaarde: | Een string die de toppositie van het geïdentificeerde element aangeeft. |
CSS Versie: | CSS2 |
Browser ondersteunt
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
Support | Support | Support | Support | Support |
- Previous page textTransform
- Next page transform
- Go back one level HTML DOM Style Object