Cum să aliniați stânga, dreapta și centrul cu CSS

Autor: Peter Berry
Data Creației: 18 August 2021
Data Actualizării: 18 Noiembrie 2024
Anonim
Cum să aliniați stânga, dreapta și centrul cu CSS - Articole
Cum să aliniați stânga, dreapta și centrul cu CSS - Articole

Conţinut

În loc să utilizați atributele de aliniere HTML conținute în etichetele HTML care marchează textul, este mai bine ca designerii web să transfere informații de prezentare (opțiuni de aliniere) la foaia de stil. Acest articol va explica modul de aliniere a textului și modul de centralizare a elementelor de pagină mai mari, cum ar fi divizările.


instrucțiuni de ghidare

Fișele de stil vă permit să aliniați și să centrați mai mult decât textul (aspectul aspectului site-ului de către 6922Designer de la Fotolia.com)

    Cum să aliniați textul

  1. Pentru a alinia textul într-un bloc normal de text, cum ar fi un paragraf sau o citare, utilizați proprietatea text-align.

  2. Opțiunile valorii pentru proprietatea text-align sunt stânga, dreapta, centru și justifică. Deoarece textul justificat nu este ușor de citit pe Web, ilustrația arată numai aliniamentele stânga, dreapta și centru. În această ilustrație, fiecare paragraf are o margine neagră pentru a demonstra dimensiunea elementului bloc pe pagină dacă nu se aplică o ajustare a lățimii elementului.

  3. De obicei, un element este atribuit unui id sau unei clase. Alinierea textului pentru orice element din acest id sau clasă este definită printr-o regulă, cum ar fi:


    stânga {

    text-aliniere: stânga; }

    dreapta {

    text-aliniere: drept; }

    centru {

    text-align: centru; }

    Cum să centralizați divizările, contururile și diviziunile corpului

  1. Poate doriți să centrați un aspect întreg sau un aspect mare. În aceste cazuri, se utilizează o tehnică CSS diferită.

  2. Aplicați regula CSS selectorului celui mai mare element pe care doriți să îl centrați. Acesta poate fi elementul corpului, diviziunea de frontieră sau divizia de containere.

  3. Centrarea prin această metodă nu afectează alinierea textului. Elementul centrat va păstra alinierea stângă implicită a textului în elementul centrat.

  4. Următoarea este o ilustrare a unui element întreg al corpului (cu o margine neagră pentru claritate) centrat pe o pagină. O lățime trebuie să fie setată pentru element, apoi marginile din stânga și din dreapta sunt setate la automat. Acest lucru se face după cum urmează:


    corp {lățime: 80%; margin-dreapta: auto; margin-stânga: auto; frontieră: 1px solid negru; }

sfaturi

  • În mod normal, nu este necesar să utilizați aliniere-stânga, deoarece alinierea stângă este cea implicită.Cu toate acestea, trebuie să fiți conștienți de faptul că există, dacă trebuie să redefiniți textul anterior centralizat sau aliniat la dreapta la implicit ulterior. Lățimea elementului care trebuie centrat poate fi definită în pixeli, procente sau ems.

Ce ai nevoie

  • Editor de text
  • Editor HTML
  • De bază cunoștințe HTML

Cele 50 de întrebări de interviu

Monica Porter

Noiembrie 2024

Unele dintre cele mai populare întrebări cu privire la interviu unt detul de generice pentru a e aplica practic oricărei poziții, dar uficient de pecifice pentru a oferi o perpectivă aupra perona...

Multe femei cred că având nipluri dureroae ete o parte normală a proceului de alăptare. Dar acet lucru nu ete adevărat. O mică enibilitate în jurul primei ăptămâni ete normală, dar ete ...

Articole Pentru Tine