Bazele aspectului modern - curs gratuit de la Hexlet, instruire 9 ore, Data: 5 decembrie 2023.
Miscelaneu / / December 06, 2023
Veți afla mai multe despre marcajul HTML și capacitățile standardului HTML5 modern. Veți dobândi, de asemenea, cunoștințe de bază despre stilare folosind CSS: învățați cum să conectați stilurile, să utilizați selectoare și să lucrați cu cascada. Pe lângă HTML și CSS, veți învăța să lucrați cu instrumentele de depanare a aspectului încorporate ale browserului, în special cu Google Chrome DevTools. Ca rezultat, veți învăța cum să utilizați limbajul de marcare HTML pentru a pune textul pe un site web și, de asemenea, veți deveni familiarizat cu regulile de bază ale utilizării CSS și stilul textului.
Veți putea pune imediat în practică noile voastre abilități - vom studia editorii de layout și pluginurile pentru acestea. La sfârșitul fiecărei lecții veți găsi mici sarcini independente. Acestea vizează o înțelegere mai practică a subiectului acoperit și, prin urmare, sunt foarte recomandate pentru implementare.
Elementele de bază ale aspectului vă vor fi utile dacă decideți să studiați dezvoltarea web, indiferent de direcție. Cunoștințele din acest curs îi ajută pe programatori să marcheze datele și să le afișeze pe site. Acest curs este potrivit pentru începători și dezvoltatori care nu au întâlnit
Introducere
Cursul „Fundamentals of Modern Layout” este baza pentru învățarea elementelor de bază ale aspectului site-ului HTML și CSS. În această lecție vom vorbi pe scurt despre ceea ce învățăm la curs și despre cum aceste cunoștințe pot fi aplicate în practică.
Introducere în HTML
Lecția este dedicată aspectului HTML de la zero. Vorbim despre rolul atributelor și studiem schema generală de descriere a etichetelor HTML.
Model bloc
Ce elemente sunt responsabile pentru cadrul paginii și care ajută în procesul de stilizare sau adăugare de părți funcționale? Să ne familiarizăm cu elementele HTML bloc și inline și să studiem influența stilurilor asupra lățimii finale a elementelor.
HTML semantic
Scopul principal al oricărui aspect HTML este de a transmite semnificația blocurilor. În această lecție, vom explora capacitățile semantice ale celui mai recent standard HTML5 și vom afla despre accesibilitatea web.
Structura de bază a unui document HTML
Orice document HTML are o structură de bază constând din etichete și elemente de serviciu. Browserul are nevoie de ele pentru a afișa informațiile corect. În această lecție ne vom uita la fiecare linie a acestei structuri.
Bazele CSS
Limbajul CSS a fost creat pentru designul vizual al unei pagini web. Studiem capacitățile de bază ale limbajului, ne dăm seama cum să le folosim împreună cu HTML. Învățăm să includem fișiere CSS și să ne familiarizăm cu tipurile de bază de selectoare.
În cascadă în CSS
Ce este cascada și cum funcționează în CSS? Lecția este dedicată diferențelor de priorități ale selecției și capacității de a utiliza acest lucru în proiectele dvs.
Chrome DevTools
Când proiectați un site web, este important să găsim erorile la timp sau să înțelegem cum să convertim corect blocul de care avem nevoie. Anterior, acest lucru se făcea în primul rând manual. În zilele noastre, browserele moderne au o funcție de inspector web. Să luăm în considerare capacitățile unuia dintre ele - Chrome DevTools.
Editori de coduri
Pentru a vă salva munca, aveți nevoie de un editor de cod. În această lecție ne vom uita la cum să instalați Visual Studio Code. Acesta este un instrument puternic care poate fi folosit nu numai pentru aspect, ci și pentru programare în orice limbă.
Emmet
Să studiem unul dintre cele mai utile plugin-uri pentru designerii de layout - Emmet. Va accelera marcarea codului HTML și va elimina majoritatea pașilor de rutină.
Publicare pe Internet
Pentru a pune un proiect pe Internet, trebuie să utilizați găzduire - un server special care va stoca fișiere și va oferi acces la ele printr-un nume de domeniu. În acest tutorial ne vom uita la găzduirea gratuită GitHub.
Editor grafic
Există mai mulți editori majori pe piață. Unele dintre ele sunt specifice unui singur sistem de operare, altele pot fi instalate pe oricare dintre ele. În această secțiune, să ne uităm la pașii principali atunci când un designer de layout lucrează cu editorul online Figma.
Muncă independentă
Sarcini suplimentare care vă permit să consolidați teoria dobândită
Materiale suplimentare
Articole și videoclipuri organizate de echipa Hexlet. Te va ajuta să aprofundezi subiectul cursului