CSS top egenskap

Definition och användning

top egenskapen specificerar elementets toppkanter. Egenskapen definierar avståndet från den övre marginalen på en positionerad element till dess innehållsblock.

Kommentar:Om värdet för "position"-egenskapen är "static", har inställningen av "top"-egenskapen ingen effekt.

Förklaring

För static-element, är det auto; för längdvärden, är det motsvarande absoluta längden; för procentvärden, är det det specificerade värdet; annars är det auto.

För element definierade relativt, om både top och bottom är auto, är deras beräknade värden båda 0; om en av dem är auto, tas den motsatta värdet av den andra; om båda inte är auto, tas bottom värdet av top värdet med negativt tecken.

Se också:

CSS-lärarlektion:CSS-positionering

HTML DOM referenshandbok:top egenskapen

Exempel

Sätt bilden så att dess övre kant är 5 pixlar under övre kanten på innehållselementet:

img
  {
  position:absolute;
  top:5px;
  }

Prova själv

CSS-syntax

top: auto|längd|initial|inherit;

Egenskapsvärde

Värde Beskrivning
auto Standardvärde. Positionen beräknas av webbläsaren.
% Ställ in övre positionen som en procentandel av innehållet. Negativa värden kan användas.
längd Använd enheter som px, cm för att ställa in övre positionen för elementet. Negativa värden kan användas.
inherit Specificerar att top egenskapen bör härledas från föräldrelementet.

Tekniska detaljer

Standardvärde: auto
Arvbarhet: nej
Version: CSS2
JavaScript-syntax: object.style.top="50px"

Mer exempel

Använd fast värde för att ställa in övre kanten på en bild
Detta exempel visar hur man använder fast värde för att ställa in övre kanten på en bild.
Använd procent för att ställa in övre kanten på en bild
Detta exempel visar hur man använder procentvärden för att ställa in övre kanten på en bild.

Webbläsarstöd

Talen i tabellen anger den första webbläsare som helt stöder egenskapen.

Chrome IE / Edge Firefox Safari Opera
1.0 5.0 1.0 1.0 6.0