Învață HTML și CSS creând o componentă de rezumat al comenzii. Puteți aplica conceptele din acest videoclip la alte tipuri de elemente și proiecte front-end.
✏️ Madison Kanna a creat acest curs. Verificați canalul ei: https://www.youtube.com/c/MadisonKanna
💻 Cod: https://github.com/Madisonkanna/tutorial-order-summary-component
🔗 Proiect: https://www.frontendmentor.io/challenges/order-summary-component-QlPmajDUj
⭐️ Conținutul cursului ⭐️
⌨️ (0:00:00) Introducere
⌨️ (0:02:26) Cum funcționează site-urile web
⌨️ (0:05:05) Introducere în HTML și CSS
⌨️ (0:03:29) Model de server și client
⌨️ (0:06:45) Ce este o componentă?
⌨️ (0:09:51) Introducere în instrumentele de proiectare
⌨️ (0:11:31) Fișiere de proiect de pornire
⌨️ (0:17:42) Terminale
⌨️ (0:18:46) Crearea proiectului
⌨️ (0:20:21) Crearea fișierului nostru index.html
⌨️ (0:24:29) HTML Body Tag
⌨️ (0:29:33) Etichete de antet HTML
⌨️ (0:30:21) Noțiuni de bază HTML
⌨️ (0:32:52) Sintaxă HTML
⌨️ (0:36:06) Noțiuni de bază CSS
⌨️ (0:36:42) Adăugarea CSS la HTML-ul nostru
⌨️ (0:39:16) Selectoare CSS
⌨️ (0:42:30) HTML, CSS și JS
⌨️ (0:46:01) Eticheta Div
⌨️ (0:48:31) Variabile CSS
⌨️ (0:52:15) Adăugarea imaginii de fundal
⌨️ (0:55:31) Adăugarea de culori de fundal
⌨️ (0:56:53) DevTools
⌨️ (0:59:03) Moștenire CSS
⌨️ (1:01:41) Specificitatea CSS
⌨️ (1:03:51) Adăugarea titlului cardului
⌨️ (1:05:24) Adăugarea imaginii cardului
⌨️ (1:09:45) Construirea cardului
⌨️ (1:10:50) Modelul cutiei CSS
⌨️ (1:13:24) CSS Box Model în acțiune
⌨️ (1:15:32) Shorthands CSS
⌨️ (1:18:02) Stiluri implicite
⌨️ (1:18:21) Dimensiunea cutiei
⌨️ (1:22:15) Stilizarea cardului
⌨️ (1:23:25) Adăugarea frontului
⌨️ (1:24:42) Proprietatea CSS Overflow
⌨️ (1:26:41) Eticheta Button
⌨️ (1:28:21) Stilizarea butoanelor
⌨️ (1:33:28) Construirea containerului de plan
⌨️ (1:35:18) Adăugarea linkului de modificare
⌨️ (1:35:40) Stilizarea containerului de plan
⌨️ (1:39:07) Centrarea conținutului în card
⌨️ (1:39:56) Centrarea cardului
⌨️ (1:40:48) Modificări finale
⌨️ (1:41:37) Outro
🎉 Mulțumim susținătorilor noștri Campion și Sponsor:
👾 Raymond Odero
👾 Agustín Kussrow
👾 aldo ferretti
👾 Otis Morgan
👾 DeezMaster
—
Învățați să codificați gratuit și obțineți un job de dezvoltator: https://www.freecodecamp.org
Citiți sute de articole despre programare: https://freecodecamp.org/news
Cursuri interesante:
- Laravel PHP Framework Tutorial – Curs complet pentru începători (2019)
- Tutorial Pygame pentru începători – Curs de dezvoltare a jocului Python
- Creați și implementați un site web de portofoliu [Curs de tutorial complet]
- Introducere în Responsive Web Design – Tutorial HTML și CSS
- Tutorial CSS – Zero to Hero (Curs complet)
- Redux Tutorial – Începător până la avansat
- Tutorial JavaScript – Creați un joc de cărți 🃏
- Python Django Web Framework – Curs complet pentru începători
- Tutorial de proiect HTML și CSS – Construiți un site web cu rețete
- Învață HTML5 și CSS3 de la zero – Curs complet