Hvordan Venstre, Høyre, Senter linje med CSS

I stedet for å bruke HTML innretting attributter med HTML-kodene som markup tekst, er den beste praksis for webdesignere å flytte presentasjonen (justeringsalternativene) informasjon til stilarket. Denne artikkelen vil forklare hvordan du kan justere tekst og hvordan å sentrere større sideelementer som divs.

Bruksanvisning

Hvordan justere tekst

1 For å justere teksten innenfor en normal tekstblokk som et avsnitt eller en blockquote, bruker text-align eiendom.

2 Hvordan Venstre, Høyre, Senter linje med CSS

De verdivalg for test-align eiendommen er til venstre, høyre, senter og rettferdiggjøre. Siden justert tekst er ikke veldig lesbart på nettet, viser illustrasjon venstre, høyre og sentrum. I denne illustrasjonen, har hvert avsnitt et svart kant for å demonstrere størrelsen av blokken element på den side hvis ingen fast bredde påtrykkes elementet.

3 Normalt et element er tilordnet en id eller klasse. Teksten justering av noen elementer i det id eller klasse er satt med en regel for eksempel en av disse: venstre {

text-align: left;

}

høyre {

text-align: right;

}

center {

text-align: center;

}

Hvordan Sentrer Divs, wrapper Divs og Body

4 Det kan være lurt å sentrere en hel layout eller en stor avdeling av en layout. I slike tilfeller bruker du en annen CSS teknikk.

5 Du bruker CSS-regel til større element velgeren du ønsker sentrert. Det kan være legemet element, et omslag div eller en beholder div.

6 Sentrering av denne metoden påvirker ikke tekstjustering. Den sentrert element vil beholde standardvenstrejustering av tekst i midtelementet.

7 Hvordan Venstre, Høyre, Senter linje med CSS


Følgende er en illustrasjon av en hel kropp element (med en svart ramme ment som en klargjøring) i midten av en side. En bredde må stilles for elementet, deretter til venstre og høyre marg er satt til auto. Slik gjør du:

kropp {

width: 80%;
margin-right: auto;
margin-left: auto;
border: 1px solid black;

}

Hint

  • Det er normalt ikke nødvendig å bruke justere venstre siden venstre justering er standard. Men du må være klar over at det eksisterer i tilfelle du må nullstille tidligere midtstilt eller høyrejustert tekst til standard i senere bruk.
  • Bredden på elementet som skal sentreres kan settes i piksler, prosenter eller EMS.