Va rugam dezactivati programul ad block pentru a vizualiza pagina!

Cumpara abonament!
Plateste cu PayPal

CSS Articole Grid. Denumirea elementelor grid. Elementele grid denumite.Proprietatea grid-template-areas.

Partajeaza in Google Classroom

Partajeaza cu Google Classroom
Susține Lectii-Virtuale!

Memorator: Descriere video Descarcă PDF

Denumirea elementelor grid (Named grid items)

Proprietatea grid-area poate fi, de asemenea, utilizată pentru a atribui nume elementelor grid.



Elementele grid denumite (Named grid items) pot fi menționate de proprietatea grid-template-areas ale containerului grid.

Exemplu:

Item1 primește numele „myArea” și se întinde pe toate cele cinci coloane într-un grid layout de cinci coloane:
.item1 {
  grid-area: myArea;
}
.grid-container {
  grid-template-areas: 'myArea myArea myArea myArea myArea';
}

Fiecare rând este definit prin apostroafe ('')

Coloanele din fiecare rând sunt definite în interiorul apostrofelor, separate de un spațiu.

Notă: Un semn de perioadă reprezintă un element grid fără nume.

Exemplu:

Permiteți „myArea” să întindă două coloane într-un aspect grid (grid layout) de cinci coloane (semnele de perioadă reprezintă elemente fără nume):
.item1 {
  grid-area: myArea;
}
.grid-container {
  grid-template-areas: 'myArea myArea . . .';
}

Pentru a defini două rânduri, definiți coloana celui de-al doilea rând în interiorul unui alt set de apostroafe:

Exemplu:

Faceți din „item1” un interval de două coloane și două rânduri:
.grid-container {
   grid-template-areas: 'myArea myArea. . .“ 'myArea myArea. . . ";
}

Exemplu:

Denumiți toate articolele și creați un ready-to-use webpage template:
.item1 { grid-area: header; }
.item2 { grid-area: menu; }
.item3 { grid-area: main; }
.item4 { grid-area: right; }
.item5 { grid-area: footer; }

.grid-container {
  grid-template-areas:
    'header header header header header header'
    'menu main main main right right'
    'menu footer footer footer footer footer';
}
Cumpara abonament
Plătește cu PayPal

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.

Despre Lecții-Virtuale.ro

Lecții-Virtuale este o platformă educațională care oferă suport în vederea pregătirii pentru Evaluare Națională și Bacalaureat la Matematică, Fizică și Chimie. Lecțiile noastre sunt alcătuite din filme și exerciții și probleme cu tot cu rezolvări. Platforma noastră este o soluție ideală pentru școala online. Pentru facilitarea activității profesorilor în cadrul ecosistemului GSuite de la Google am implementat butonul Google Classroom. Scopul nostru este să ne concentrăm pe prezentarea noțiunilor și fenomenelor într-o manieră care să stimuleze înțelegerea și nu memorarea mecanică. Ne propunem să facilităm accesul la conținut educațional de calitate mai ales elevilor cu venituri mai modeste care nu își pemit meditații particulare. Sperăm să vă simțiti bine alături de noi și să invățați lucruri folositoare. Hai România!

Newsletter

Abonează-te la Newsletter pentru a fi la curent cu toate ofertele noastre.

Parteneri

EduApps partener Lectii Virtuale UiPath partener Lectii Virtuale Scoala365 partener Lectii Virtuale CCD Galați partener Lectii Virtuale

2024 © Lecții-virtuale.ro Toate drepturile rezervate
Termeni   Despre   Contact   Confidenţialitate   Cariere Parteneri