CSS Top Vs. Margin-Top

Med gripende stilark, eller CSS, kan du plassere nesten alle Hypertext Markup Language element, inkludert bilder, tekst, div lag, tabeller og lister på nettstedet ditt. Enten du bruker "toppen" eiendom eller "margin-top" CSS eiendom avhenger av andre elementer på siden din og deres plassering forhold til hverandre.

Bakgrunn

CSS, en forkortelse for Cascading Style Sheets, er en type web koding som du bruker i forbindelse med HTML. CSS gjelder stiler til eksisterende HTML-elementer. For eksempel kan du fargelegge tekst, tildele dekorere til tekstlenker, angir grenser for bilder og endre form elementer med CSS. CSS tilbyr muligheten til å sette marginer, plassen mellom utsiden av containeren som en tabell, celle eller div lag og angi plassering av elementer i Web-side.

Egenskaper

CSS eiendom for en elementer toppmargen er "margin-top". Når du angir en verdi i piksler, inches eller prosentandel av denne eiendommen til et element, for eksempel et bord, vil tabellen ser ut til å bevege seg nedover på siden som CSS setter mer plass mellom toppen av tabellen, og andre on-side elementer. CSS "top" Eiendommen alltid brukes sammen med "stilling" eiendom. Fordi det er flere stillingstyper, kan resultatet avvike

CSS Positioning

Ved bruk av "top" eiendom i CSS, må du også angi type stilling. Hvis du bruker absolutt posisjonering, "topp" egenskaper angir hvor mange enheter er mellom den øvre kanten av et element og dens inneholder element. For eksempel kan du angi en verdi eller 300-piksler for "toppen" eiendom for et bilde. En absolutt posisjonert bildet kan vises som 300-piksler under toppen av tabellen som inneholder det. I kontrakten relative posisjonering plasserer bilde 300-piksler under bildet normale (uten posisjonering) posisjon. Du kan også angi bildets forhold til nettleservinduet med fast posisjonering og "toppen" eiendom.

betraktninger

Du kan bruke "topp" og "top margin" egenskaper å style ditt nettsted elementer. For eksempel, hvis du bruker relative posisjonering, du kan fortsatt ønsker å legge til en liten margin, 10 piksler, mellom et bord og en div. Selv om du kan bruke bare margen eiendommen for å plassere elementer på skjermen, må du innlemme faktiske marginer i disse verdiene. Hvis du bare ønsker å lage mellomrom mellom elementer, kan du bruke bare toppmargen eiendom. Du kan også angi et element toppmargen med forkortelsen "margin" eiendom, som lar deg sette alle fire marigns (øverste, høyre, bunn og venstre) på en gang. For eksempel, for å sette alle marginer til 5-piksler, gjelder følgende CSS til velgeren / HTML-kode:

{Margin: 5px;}