Elemente HTML Layout. Tehnici Layout HTML. Tabele HTML. CSS Frameworks. CSS Floats. CSS Flexbox. CSS Grid View.
Partajeaza in Google Classroom
Partajeaza cu Google Classroom
Susține Lectii-Virtuale!
Memorator: Descriere video Descarcă PDF
Tehnici Layout HTML
Există cinci moduri diferite de a crea multicolumn layouts.
Elementul <table> nu a fost proiectat pentru a fi un instrument de aspect! Scopul elementului <tabel> este afișarea datelor tabulare. Deci, nu folosiți tabele pentru aspectul paginii dvs.! Vor aduce dezordine în codul dvs. Și imaginați-vă cât de greu va fi să vă reproiectați site-ul după câteva luni.
Sfat: NU folosiți tabele pentru aspectul paginii!
CSS Frameworks
Dacă doriți să vă creați rapid un layout, puteți utiliza un framework cum ar fi Bootstrap.
CSS Floats
Este ceva comun să faceți machete web (web layouts) întregi folosind proprietatea CSS float. Float este ușor de învățat - trebuie doar să vă amintiți cum funcționează float și proprietățile clare.
Dezavantaje: Elementele float sunt legate de fluxul de documente, care pot afecta flexibilitatea.
Exemplu:
CSS Flexbox
Flexbox reprezintă un nou mod de dispunere în CSS3.
Utilizarea flexboxului asigură că elementele se comportă în mod previzibil atunci când aspectul paginii trebuie să găzduiască dimensiuni de ecran diferite și dispozitive de afișare diferite.
Dezavantaje: Nu funcționează în IE10 și în cele anterioare.
Exemplu:
CSS Grid View
Modulul CSS Grid Layout oferă un sistem de dispunere bazat pe grilă, cu rânduri și coloane, ceea ce facilitează proiectarea paginilor web fără a fi nevoie să folosiți floats și poziționare.
Dezavantaje: Nu funcționează în IE și nici în Edge 15 și nici în precedentele.
Există cinci moduri diferite de a crea multicolumn layouts.
- Tabele HTML (nerecomandat)
- Proprietatea CSS float
- CSS flexbox
- CSS framework
- CSS grid
Elementul <table> nu a fost proiectat pentru a fi un instrument de aspect! Scopul elementului <tabel> este afișarea datelor tabulare. Deci, nu folosiți tabele pentru aspectul paginii dvs.! Vor aduce dezordine în codul dvs. Și imaginați-vă cât de greu va fi să vă reproiectați site-ul după câteva luni.
Sfat: NU folosiți tabele pentru aspectul paginii!
CSS Frameworks
Dacă doriți să vă creați rapid un layout, puteți utiliza un framework cum ar fi Bootstrap.
CSS Floats
Este ceva comun să faceți machete web (web layouts) întregi folosind proprietatea CSS float. Float este ușor de învățat - trebuie doar să vă amintiți cum funcționează float și proprietățile clare.
Dezavantaje: Elementele float sunt legate de fluxul de documente, care pot afecta flexibilitatea.
Exemplu:
CSS Flexbox
Flexbox reprezintă un nou mod de dispunere în CSS3.
Utilizarea flexboxului asigură că elementele se comportă în mod previzibil atunci când aspectul paginii trebuie să găzduiască dimensiuni de ecran diferite și dispozitive de afișare diferite.
Dezavantaje: Nu funcționează în IE10 și în cele anterioare.
Exemplu:
CSS Grid View
Modulul CSS Grid Layout oferă un sistem de dispunere bazat pe grilă, cu rânduri și coloane, ceea ce facilitează proiectarea paginilor web fără a fi nevoie să folosiți floats și poziționare.
Dezavantaje: Nu funcționează în IE și nici în Edge 15 și nici în precedentele.
Navigare în lectii
Cumpara abonament
Ajutor
Feedback-ul d-voastră este important pentru noi. Dacă observați vreo neregulă vă rugăm să ne-o semnalați apăsând butonul Trimite Feedback de mai jos.
