NÁZEV ŠKOLY: Základní škola Josefa Bublíka, Bánov AUTOR: Ivana Mačková NÁZEV: VY_32_INOVACE_SADA5_INF.9.15 TÉMA: HTML - seznamy ČÍSLO PROJEKTU: CZ.1.07/1.4.00/21.2609
Anotace Materiál HTML - seznamy Vzdělávací obor Informatika Tematický okruh HTML – tvorba www stránek Anotace Výukový materiál je určen k vysvětlení a procvičení příkazu pro psaní seznamů v html dokumentech. Očekávaný výstup Žák pochopí význam příkazů <ol> a <ul> a jejich parametry. Získané poznatky aplikuje při psaní číslovaných a nečíslovaných seznamů v html dokumentech. Druh učebního materiálu Prezentace Stupeň a typ vzdělávání Základní vzdělávání – druhý stupeň, 9. ročník
HTML - SEZNAMY Číslované seznamy Při tvorbě HTML dokumentů pro přehlednost textu můžeme (podobně jako v textovém editoru) používat tyto základní typy seznamů: číslované nečíslované Číslované seznamy Mají před každou položkou číslo nebo písmeno. Začátek a konec seznamu označují tagy <ol> a </ol> Jednotlivé položky seznamu se zapisují mezi tagy <li> ... </li>.
<ol type=A/a/I/i/1> Atribut tagu <ol> K tagu <ol> připisujeme atribut type, kterým definujeme styl číslování. <ol type=A/a/I/i/1> A - velká písmena a - malá písmena I - římské číslování (velká písmena) i - římské číslování (malá písmena) 1 - arabské číslování
PŘÍKLAD ČÍSLOVANÉHO SEZNAMU HTML dokument V prohlížeči
<ul type=disc/circle/square> Nečíslované seznamy Mají před každou položkou odrážku. Začátek a konec seznamu označují tagy <ul> a </ul> Jednotlivé položky seznamu se zapisují mezi tagy <li> ... </li>. Atribut tagu <ul> Styl odrážky zadáváme opět atributem type. <ul type=disc/circle/square> disc - kruh circle - kružnici square - čtverec
PŘÍKLAD NEČÍSLOVANÉHO SEZNAMU HTML dokument V prohlížeči
ÚKOL: Vytvořte HTML dokumenty pro seznamy dle předlohy. ŘEŠENÍ
Sporty Světadíly
ÚKOL: Vytvořte HTML dokument pro seznam dle předlohy. ŘEŠENÍ
Citace Ilustrace: Kopie obrazovek programu Poznámkový blok – vlastní tvorba autora Kopie obrazovek internetového prohlížeče – vlastní tvorba autora www.office.microsoft.com www.office.microsoft.com