К содержанию

Učebnice HTML a CSS pro začátečníky

Jednoduchá učebnice tvorby webových stránek v jazycích HTML a CSS pro začátečníky s podrobnou teorií a sadou úloh.

Selektory

Rodinné vztahy tagů v HTML

Dědičnost CSS vlastností

Seskupování selektorů v CSS

Obecné vlastnosti při seskupování selektorů v CSS

Selektor potomků v CSS

Dceřiný selektor v CSS

Třídy prvků v CSS

Tag span pro kousky textu v HTML

Tag div pro skupinu tagů v HTML

Seskupování tříd v CSS

Tag s danou třídou v CSS

Selektor potomků a třídy v CSS

Složité kombinace selektorů potomků a tříd v CSS

Chyba začátečníků v selektoru potomků

Prvek s více CSS třídami

Výběr elementu podle jedinečného id v CSS

Selektor podle id a CSS třídy

Použití id v CSS

Výběr elementu podle více tříd v CSS

Několik selektorů spojitě v CSS

Chyba při použití více CSS selektorů

Seskupování složitých selektorů v CSS

Chyba při seskupování složitých CSS selektorů

Praktika na kombinace CSS selektorů

Priorita selektorů CSS

Poznámka ke konfliktu vlastností CSS

Pravla specificity v CSS

Priorita selektorů potomků v CSS

Sousední selektor v CSS

Sesterský selektor v CSS

Univerzální selektor v CSS

Selektory atributů v CSS

Stavy odkazů v CSS

Nuance sledování stavu odkazů v CSS

Stavy odkazů link a visited v CSS

Běžné použití stavů odkazů v CSS

Složité selektory se stavy odkazů v CSS

Odkaz s třídou v CSS

Výběr koncových prvků v CSS

Výběr podle pozice prvků v CSS

Výběr jediného potomka v CSS

Výběr prázdných prvků v CSS

Výběr podle pozice a typu prvků v CSS

Selektor negace v CSS

Dekorace

Nastavení barvy pozadí v CSS

Základy práce s okraji v CSS

Plná ohraničení v CSS

Tečkovaný okraj v CSS

Ohraničení ve formě čárek v CSS

Konvexní ohraničení v CSS

Dvojitý okraj v CSS

Vlastnost zkratka pro ohraničení v CSS

Ohraničení pro jednotlivé strany v CSS

Zaoblení okrajů bloku v CSS

Zaoblení okrajů pozadí v CSS

Vytvoření kruhu v CSS

Různé zaoblení pro různé rohy v CSS

Čtyři hodnoty zaoblení pro různé rohy v CSS

Dvě hodnoty zaoblení pro různé rohy v CSS

Tři hodnoty zaoblení pro různé rohy v CSS

Zaoblené rohy v procentech v CSS

Vytvoření kruhu pomocí zaoblení v procentech v CSS

Obrázek na pozadí v CSS

Opakování obrázku pozadí v CSS

Další vlastnosti pro pozadí v CSS

Práce s markery seznamů ul v CSS

Čtvercové značky seznamů ul v CSS

Značky seznamu ul ve tvaru kroužků v CSS

Práce se značkami seznamů ul v CSS

Odstranění značek seznamu ul v CSS

Práce se značkami seznamů ol v CSS

Malá římská čísla pro seznamy ol v CSS

Velká římská čísla pro seznamy ol v CSS

Malá latinská písmena pro seznamy ol v CSS

Velká latinská písmena pro seznamy ol v CSS

Řadové řecké písmena pro seznamy ol v CSS

Čísla s úvodní nulou pro seznamy ol v CSS

Box model

Práce s okraji margin v CSS

Odsazení margin pro různé strany v CSS

Několik hodnot ve vlastnosti margin v CSS

Čtyři hodnoty ve vlastnosti margin v CSS

Dvě hodnoty ve vlastnosti margin v CSS

Tři hodnoty ve vlastnosti margin v CSS

Práce s odsazením padding v CSS

Odsazení padding pro různé strany v CSS

Několik hodnot ve vlastnosti padding v CSS

Práce s odsazením padding v CSS

Vliv ohraničení na rozšiřování prvků v CSS

Vliv paddingu a ohraničení na rozšiřování prvků v CSS

Zrušení rozšiřování prvků v CSS

Vlastnosti blokových elementů v CSS

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

Šířka blokového elementu v CSS

Výška blokového elementu v CSS

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

Několik blokových prvků vedle sebe v CSS

Vlastnosti inline elementů v CSS

Šířka a výška řádkového elementu v CSS

Několik řádkových prvků vedle sebe v CSS

Odsazení mezi řádkovými elementy v CSS

Definice blokového modelu HTML tagů

Práce s vlastností display v CSS

Vlastnosti inline-block elementů v CSS

Šířka a výška řádkově-blokového prvku v CSS

Šířka řádkově-blokového elementu v CSS

Výška řádkově-blokového elementu v CSS

Několik řádkově-blokových prvků vedle sebe v CSS

Zarovnání blokových prvků v CSS

Zarovnání blokového prvku s odsazením zleva v CSS

Zarovnání blokového prvku s odsazením vpravo v CSS

Zarovnání inline elementů v CSS

Centrování řádkových prvků v CSS

Centrování více řádkových prvků

Zarovnání řádkových prvků na pravý okraj v CSS

Zarovnání řádkově-blokových elementů v CSS

Centrování řádkově-blokových prvků v CSS

Zarovnání řádkově-blokových prvků na pravý okraj v CSS

Flexbox prvky v CSS

Výška rodiče flex elementů v CSS

Šířka rodiče flex elementů v CSS

Řádkově-blokový rodič flex elementů v CSS

Odsazení padding rodičovského prvku flex prvků v CSS

Odsazení margin pro potomky v CSS

Zarovnání flex elementů v CSS

Zarovnání flex prvků na střed v CSS

Zarovnání flex elementů podle rodiče v CSS

Zarovnání flex prvků podle rodiče s odsazením

Zarovnání flex elementů podle rodiče se stejnými odsazeními

Pozicování

Absolutní pozicování prvků v CSS

Relativní pozicování prvků v CSS

Pozicování vůči rodiči v CSS

Pozicování relativně k absolutnímu rodiči v CSS

Absolutní pozicování bez souřadnic v CSS

Centrování pomocí absolutní pozice v CSS

Záporné hodnoty při pozicování v CSS

Fixní pozicování v CSS

Blok na celou šířku obrazovky v CSS

Vrstvení prvků podél osy Z v CSS

Řízení překrývání prvků podél osy Z v CSS

Nuance použití záporné hodnoty z-index v CSS

Float

Úvod do vlastnosti float v CSS

Pronikání plovoucích prvků přes tagy v CSS

Kombinace float a margin v CSS

Kombinace float a padding v CSS

Plovoucí prvky pod tagy v CSS

Působení floatů na rodiče v CSS

Výška rodiče floatů v CSS

Text v rodiči floatů v CSS

Obtékání v CSS

Zrušení obtékání pomocí vlastnosti clear v CSS

Samostatný div s clearfix v CSS

Clearfix a výška rodiče v CSS

Vlastnost float pro bloky v CSS

Vlastnost float a několik bloků v CSS

Vlastnost float a rodič bez textu v CSS

Flexbox

Uspořádání flex prvků do řádku nebo sloupce v CSS

Uspořádání flex prvků v obráceném řádku v CSS

Uspořádání flex prvků do sloupce v CSS

Otočení sloupce s flex prvky v CSS

Hlavní a příčná osa ve flexboxu v CSS

Zarovnání flex prvků podél hlavní osy v CSS

Zarovnání flexboxů na příčné ose v CSS

Hodnota center vlastnosti align-items v CSS

Centrování bez výšky bloků v CSS

Centrování bloků s různou výškou v CSS

Význam hodnoty stretch vlastnosti align-items v CSS

Praxe na zarovnání podle os v CSS

Zarovnání jednotlivého prvku ve flex modelu v CSS

Pořadí flex bloků v CSS

Gridy

Úvod do CSS gridů

Stopy a čáry v CSS gridu

Zobrazení gridů v prohlížečovém ladicím nástroji

Počet a šířka sloupců v CSS gridu

Jednotka fr v CSS gridů

Dílčí jednotky fr v CSS gridu

Pixely a jednotky fr v CSS gridů

Procenta a jednotky fr v CSS gridu

Funkce repeat v CSS gridu

Význam auto v CSS gridu

Význam auto-fill v CSS gridů

Funkce minmax v CSS gridu

Význam auto-fit v CSS gridu

Počet a šířka řádků v CSS gridu

Zkratka pro řádky a sloupce v CSS gridu

Spojování řádků v CSS gridu

Sloučení sloupců v CSS gridu

Kombinace spojování po řádcích a sloupcích v CSS gridů

Překrývání sloupců v CSS gridu

Vzdálenost mezi sloupci v CSS gridu

Mezery mezi řádky v CSS gridu

Vzdálenost mezi sloupci a řádky v CSS gridu

Dlaždicové rozložení v CSS Grid

Rozvržení

Vytváření menu v CSS

Jednoduché jednosloupcové layouty webových stránek v CSS

Schéma rozvržení s více obalovými prvky v CSS

Strukturální bloky webu v HTML

Schéma dvousloupcového layoutu webu v CSS

Schéma třísloupcového layoutu webu v CSS

Speciální tagy pro prvky rozvržení webu v HTML

Základní layoutové tagy v HTML

Tag pro sekce v HTML

Praxe na maketách v HTML a CSS