Kaasaegse küljenduse põhitõed - tasuta kursus Hexletilt, koolitus 9 tundi, Kuupäev: 5. detsember 2023.
Varia / / December 06, 2023
Saate lisateavet HTML-i märgistuse ja kaasaegse HTML5-standardi võimaluste kohta. Samuti saate algteadmised stiilide loomisest CSS-i abil: saate teada, kuidas stiile ühendada, kasutada selektoreid ja töötada kaskaadiga. Lisaks HTML-ile ja CSS-ile õpite töötama brauseri sisseehitatud paigutuse silumistööriistadega, eelkõige Google Chrome DevToolsiga. Selle tulemusena saate teada, kuidas kasutada HTML-i märgistuskeelt veebisaidil teksti küljendamiseks, samuti saate tuttavaks CSS-i kasutamise ja tekstistiili põhireeglitega.
Saate oma uusi oskusi kohe ellu rakendada – uurime nende jaoks paigutusredaktoreid ja pluginaid. Iga tunni lõpust leiate väikesed iseseisvad ülesanded. Need on suunatud käsitletava teema praktilisemale mõistmisele ja seetõttu on need rakendamiseks väga soovitatavad.
Paigutuse põhitõed tulevad kasuks, kui otsustate veebiarendust õppida, olenemata suunast. Sellel kursusel saadud teadmised aitavad programmeerijatel andmeid märgistada ja saidil kuvada. See kursus sobib algajatele ja arendajatele, kes pole sellega kokku puutunud
Sissejuhatus
Kursus “Moodsa paigutuse alused” on aluseks HTML-i ja CSS-i veebilehe paigutuse põhitõdede õppimisele. Selles tunnis räägime lühidalt sellest, mida kursusel õpime ja kuidas neid teadmisi praktikas rakendada.
Sissejuhatus HTML-i
Tund on pühendatud HTML-i paigutusele nullist. Räägime atribuutide rollist ja uurime üldist skeemi HTML-märgendite kirjeldamiseks.
Ploki mudel
Millised elemendid vastutavad lehe raami eest ja millised aitavad selle kujundamisel või funktsionaalsete osade lisamisel? Tutvume plokk- ja inline HTML-i elementidega ning uurime stiilide mõju elementide lõplikule laiusele.
Semantiline HTML
Iga HTML-i paigutuse peamine eesmärk on anda edasi plokkide tähendus. Selles õppetükis uurime uusima HTML5 standardi semantilisi võimalusi ja õpime veebi juurdepääsetavuse kohta.
HTML-dokumendi põhistruktuur
Igal HTML-dokumendil on põhistruktuur, mis koosneb siltidest ja teenuseelementidest. Brauser vajab neid teabe korrektseks kuvamiseks. Selles õppetükis vaatleme selle struktuuri iga rida.
CSS-i põhitõed
CSS keel loodi veebilehe visuaalseks kujundamiseks. Uurime keele põhilisi võimalusi, mõtleme välja, kuidas neid koos HTML-iga kasutada. Õpime kaasama CSS-faile ja tutvume selektorite põhitüüpidega.
Kaskaad CSS-is
Mis on kaskaad ja kuidas see CSS-is töötab? Tund on pühendatud valija prioriteetide erinevustele ja võimalusele seda oma projektides kasutada.
Chrome DevTools
Veebisaidi küljendamisel on oluline leida õigeaegselt vead või mõista, kuidas meile vajalik plokk õigesti teisendada. Varem tehti seda peamiselt käsitsi. Tänapäeval on kaasaegsetel brauseritel veebiinspektori funktsioon. Vaatleme ühe neist – Chrome DevToolsi – võimalusi.
Koodiredaktorid
Töö salvestamiseks vajate koodiredaktorit. Selles õppetükis vaatleme, kuidas installida Visual Studio Code. See on võimas tööriist, mida saab kasutada mitte ainult küljendamiseks, vaid ka programmeerimiseks mis tahes keeles.
Emmet
Uurime ühte küljenduskujundajate jaoks kõige kasulikumat pistikprogrammi - Emmet. See kiirendab HTML-koodi märgistamist ja eemaldab enamiku rutiinsetest sammudest.
Avaldamine Internetis
Projekti Internetti panemiseks peate kasutama hostimist - spetsiaalset serverit, mis salvestab faile ja pakub neile juurdepääsu domeeninime kaudu. Selles õpetuses vaatleme tasuta GitHubi hostimist.
Graafiline redaktor
Turul on mitu suurt toimetajat. Mõned neist on omased ainult ühele operatsioonisüsteemile, teised saab installida ükskõik millisesse neist. Selles jaotises vaatleme peamisi samme, kui küljenduskujundaja töötab Figma veebiredaktoriga.
Iseseisev töö
Lisaülesanded, mis võimaldavad omandatud teooriat kinnistada
Lisamaterjalid
Hexleti meeskonna kureeritud artiklid ja videod. Aitab sul süveneda kursuse teemasse