msb-public
/
Web-Dev-For-Beginners
mirror of https://github.com/microsoft/Web-Dev-For-Beginners.git
1
0
Code Issues Projects Releases Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from 'c6eb20fcc1'
${ noResults }
Web-Dev-For-Beginners/translations/ro/3-terrarium/2-intro-to-css/assignment.md

3.0 KiB
Raw Blame History

Tema de Refactorizare CSS

Obiectiv

Refactorizează proiectul terrarium pentru a utiliza Flexbox sau CSS Grid pentru layout. Actualizează HTML-ul și CSS-ul după cum este necesar pentru a obține un design modern și responsiv. Nu este nevoie să implementezi elemente drag-and-drop—concentrează-te doar pe layout și stilizare.

Instrucțiuni

  1. Creează o versiune nouă a aplicației terrarium. Actualizează marcajul și CSS-ul pentru a utiliza Flexbox sau CSS Grid pentru layout.
  2. Asigură-te că arta și elementele sunt prezente la fel ca în versiunea originală.
  3. Testează designul în cel puțin două browsere diferite (de exemplu, Chrome, Firefox, Edge).
  4. Fă capturi de ecran ale terrarium-ului în fiecare browser pentru a demonstra compatibilitatea între browsere.
  5. Trimite codul actualizat și capturile de ecran.

Criterii de Evaluare

Criteriu Exemplară Adecvat Necesită Îmbunătățiri
Layout Refactorizat complet folosind Flexbox sau CSS Grid; aspect vizual plăcut și responsiv Unele elemente refactorizate; utilizare parțială a Flexbox sau Grid Utilizare redusă sau inexistentă a Flexbox sau Grid; layout neschimbat
Compatibilitate între Browsere Capturi de ecran furnizate pentru mai multe browsere; aspect consistent Capturi de ecran pentru un singur browser; mici inconsistențe Fără capturi de ecran sau inconsistențe majore
Calitatea Codului HTML/CSS curat, bine organizat; comentarii clare Organizare parțială; puține comentarii Cod dezorganizat; lipsa comentariilor

Sfaturi

  • Consultă ghidurile Flexbox și CSS Grid.
  • Folosește instrumentele de dezvoltare ale browserului pentru a testa responsivitatea.
  • Comentează codul pentru claritate.

Declinare de responsabilitate:
Acest document a fost tradus folosind serviciul de traducere AI Co-op Translator. Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa maternă ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist uman. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.