К содержанию

Tutoriál HTML a CSS pre začiatočníkov

Jednoduchý tutoriál tvorby webstránok v jazykoch HTML a CSS pre začiatočníkov s podrobnou teóriou a zbierkou úloh.

Selektory

Príbuzenské vzťahy tagov v HTML

Dedenie CSS vlastností

Zoskupovanie selektorov v CSS

Všeobecné vlastnosti pri zoskupovaní selektorov v CSS

Selektor potomkov v CSS

Dcérsky selektor v CSS

Triedy prvkov v CSS

Prvok span pre kúsky textu v HTML

Prvok div pre zoskupenie prvkov v HTML

Zoskupovanie tried v CSS

Element s danou triedou v CSS

Selektor potomkov a triedy v CSS

Zložité kombinácie selektora potomkov a tried v CSS

Chyba začiatočníkov v selektore potomkov

Prvok s viacerými CSS triedami

Výber elementu podľa unikátneho id v CSS

Selektor podľa id a CSS triedy

Používanie id v CSS

Výber prvku podľa viacerých tried v CSS

Niekoľko selektorov spojených v CSS

Chyba pri použití viacerých CSS selektorov

Zoskupovanie zložitých selektorov v CSS

Chyba pri zoskupovaní zložitých CSS selektorov

Prax na kombinácie CSS selektorov

Priorita selektorov CSS

Poznámka ku konfliktu vlastností CSS

Pravidlá špecificity v CSS

Priorita selektorov potomkov v CSS

Susedný selektor v CSS

Susedský selektor v CSS

Univerzálny selektor v CSS

Selektory atribútov v CSS

Stavy odkazov v CSS

Nuansy postupnosti stavov odkazov v CSS

Stavy odkazov link a visited v CSS

Bežné použitie stavov odkazov v CSS

Zložité selektory so stavmi odkazov v CSS

Odkaz s triedou v CSS

Výber koncových prvkov v CSS

Výber podľa pozície prvkov v CSS

Výber jediného potomka v CSS

Výber prázdnych elementov v CSS

Výber podľa pozície a typu elementov v CSS

Selektor negácie v CSS

Dekorácie

Nastavenie farby pozadia v CSS

Základy práce s rámami v CSS

Plná ohraničenie v CSS

Bodkovaný okraj v CSS

Čiarkovaný okraj v CSS

Vypuklý okraj v CSS

Dvojitý okraj v CSS

Vlastnosť-skratka pre rámček v CSS

Okraje pre jednotlivé strany v CSS

Zaoblenie okrajov bloku v CSS

Zaoblenie okrajov pozadia v CSS

Vytvorenie kruhu v CSS

Rôzne zaoblenia pre rôzne rohy v CSS

Štyri hodnoty pre zaoblenie rôznych rohov v CSS

Dve hodnoty zaoblenia pre rôzne rohy v CSS

Tri hodnoty zaoblenia pre rôzne rohy v CSS

Zaoblené rohy v percentách v CSS

Vytvorenie kruhu pomocou percentuálneho zaoblenia v CSS

Obrázok ako pozadie v CSS

Opakovanie obrázka pozadia v CSS

Ostatné vlastnosti pre pozadie v CSS

Práca so značkami zoznamov ul v CSS

Štvorcové značky zoznamov ul v CSS

Značky zoznamu ul ako krúžky v CSS

Práca so značkami zoznamov ul v CSS

Odstránenie značkovacích symbolov zoznamov ul v CSS

Práca s značkami zoznamov ol v CSS

Rímske číslice v malých písmenách pre zoznamy ol v CSS

Veľké rímske číslice pre zoznamy ol v CSS

Malé latinské písmená pre zoznamy ol v CSS

Veľké latinské písmená pre zoznamy ol v CSS

Malé grécke písmená pre zoznamy ol v CSS

Čísla s nulou na začiatku pre zoznamy ol v CSS

Blokový model

Práca s okrajmi margin v CSS

Okraje margin pre rôzne strany v CSS

Viacero hodnôt vo vlastnosti margin v CSS

Štyri hodnoty vo vlastnosti margin v CSS

Dve hodnoty vo vlastnosti margin v CSS

Tri hodnoty vo vlastnosti margin v CSS

Práca s odsadením padding v CSS

Odsadenia padding pre rôzne strany v CSS

Viacero hodnôt vo vlastnosti padding v CSS

Práca s odsadením padding v CSS

Vplyv okraja na rozširovanie prvkov v CSS

Vplyv paddingu a okraja na rozširovanie prvkov v CSS

Zrušenie rozširovania elementov v CSS

Vlastnosti blokových elementov v CSS

Šírka a výška blokového elementu v CSS

Šírka blokového elementu v CSS

Výška blokového elementu v CSS

Výška blokového elementu bez obsahu v CSS

Niekoľko blokových prvkov vedľa seba v CSS

Špecifikácie inline elementov v CSS

Šírka a výška inline elementu v CSS

Niekoľko inline elementov vedľa seba v CSS

Odsadenia medzi inline elementmi v CSS

Definícia blokového modelu HTML tagov

Práca s vlastnosťou display v CSS

Špecifikácie inline-blokových elementov v CSS

Šírka a výška inline-blokového elementu v CSS

Šírka inline-block elementu v CSS

Výška inline-block elementu v CSS

Viacero inline-block elementov vedľa seba v CSS

Zarovnanie blokových elementov v CSS

Zarovnanie blokového prvku s odsadením vľavo v CSS

Zarovnanie blokového prvku s odstupom vpravo v CSS

Zarovnanie inline elementov v CSS

Centrovanie inline elementov v CSS

Centrovanie viacerých inline elementov

Zarovnanie inline prvkov na pravý okraj v CSS

Zarovnanie inline-block elementov v CSS

Centrovanie inline-blokových elementov v CSS

Zarovnanie inline-blokových prvkov na pravý okraj v CSS

Flex elementy v CSS

Výška rodiča flex elementov v CSS

Šírka rodiča flex elementov v CSS

Riadkovo-blokový rodič flex elementov v CSS

Odsadenia padding rodiča flex elementov v CSS

Odsadenia margin pre potomkov v CSS

Zarovnanie flex elementov v CSS

Centrovanie flex elementov v CSS

Zarovnanie flex elementov podľa rodiča v CSS

Zarovnanie flex elementov podľa rodiča s odstupmi

Zarovnanie flex elementov na rodičovi s rovnakými odstupmi

Umiestňovanie

Absolútne pozicionovanie prvkov v CSS

Relatívne pozicionovanie prvkov v CSS

Pozicionovanie vzhľadom na rodiča v CSS

Pozícionovanie vzhľadom na absolútneho rodiča v CSS

Absolútne pozicionovanie bez súradníc v CSS

Centrovanie cez absolute v CSS

Záporné hodnoty pri pozicionovaní v CSS

Fixné pozícionovanie v CSS

Blok na celú šírku obrazovky v CSS

Usporiadanie prvkov pozdĺž osi Z v CSS

Regulovanie prekrytia prvkov pozdĺž osi Z v CSS

Nuansy použitia zápornej hodnoty z-index v CSS

Float

Úvod do vlastnosti float v CSS

Prenikanie plávajúcich elementov cez značky v CSS

Kombinácia float a margin v CSS

Kombinácia float a padding v CSS

Plávajúce elementy pod tagmi v CSS

Pôsobenie floatov na rodiča v CSS

Výška rodiča floatov v CSS

Text v rodičovi floatov v CSS

Obtiekanie v CSS

Zrušenie obtoku pomocou vlastnosti clear v CSS

Samostatný div s clearfix v CSS

Clearfix a výška rodiča v CSS

Vlastnosť float pre bloky v CSS

Vlastnosť float a niekoľko blokov v CSS

Vlastnosť float a rodič bez textu v CSS

Flexbox

Umiestnenie flex prvkov do radu alebo stĺpca v CSS

Umiestnenie flex elementov v prevrátenom rade v CSS

Umiestnenie flex elementov do stĺpca v CSS

Obrátenie stĺpca s flex elementmi v CSS

Hlavná a priečna os vo flexbox v CSS

Zarovnanie flex elementov po hlavnej osi v CSS

Zarovnanie flex boxov pozdĺž priečnej osi v CSS

Hodnota center vlastnosti align-items v CSS

Centrovanie bez výšky blokov v CSS

Centrovanie s rôznou výškou blokov v CSS

Význam hodnoty stretch vlastnosti align-items v CSS

Prax na zarovnanie po osiach v CSS

Zarovnanie jednotlivého prvku vo flexbox modeli v CSS

Poradie flex blokov v CSS

Gridy

Úvod do CSS gridov

Stopy a čiary v CSS gridoch

Zobrazenie gridov v ladiacom nástroji prehliadača

Počet a šírka stĺpcov v CSS gridoch

Jednotka fr v CSS gridoch

Zlomkové jednotky fr v CSS gridoch

Pixely a jednotky fr v CSS gridoch

Percentá a jednotky fr v CSS gridoch

Funkcia repeat v CSS gridoch

Hodnota auto v CSS gridoch

Hodnota auto-fill v CSS gridoch

Funkcia minmax v CSS gridoch

Význam auto-fit v CSS gridoch

Počet a šírka riadkov v CSS gridoch

Skratka pre riadky a stĺpce v CSS gridoch

Spájanie riadkov v CSS gridoch

Spájanie stĺpcov v CSS gridoch

Kombinácie spojení po riadkoch a stĺpcoch v CSS gridoch

Prekrývanie stĺpcov v CSS gridoch

Medzera medzi stĺpcami v CSS gridoch

Medzera medzi riadkami v CSS gridoch

Medzery medzi stĺpcami a riadkami v CSS gridoch

Mriežkové rozloženie (Grid) v CSS

Layouty

Tvorba menu v CSS

Jednoduché jednosĺpcové layouty stránok v CSS

Schéma rozloženia s viacerými obalmi v CSS

Štrukturálne bloky stránky v HTML

Schéma dvojstĺpcového layoutu stránky v CSS

Schéma trojstĺpcového layoutu stránky v CSS

Špeciálne značky pre prvky rozloženia stránky v HTML

Hlavné značky rozloženia v HTML

Značka pre sekcie v HTML

Prax na layoutoch v HTML a CSS