NÁZEV ŠKOLY: Základní škola Josefa Bublíka, Bánov

Prezentace na téma: "NÁZEV ŠKOLY: Základní škola Josefa Bublíka, Bánov"— Transkript prezentace:

1 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/

2 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

3 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>.

4 <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í

5 PŘÍKLAD ČÍSLOVANÉHO SEZNAMU
HTML dokument V prohlížeči

6 <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

7 PŘÍKLAD NEČÍSLOVANÉHO SEZNAMU
HTML dokument V prohlížeči

8 ÚKOL: Vytvořte HTML dokumenty pro seznamy dle předlohy.
ŘEŠENÍ

9 Sporty Světadíly

10 ÚKOL: Vytvořte HTML dokument pro seznam dle předlohy.
ŘEŠENÍ

11

12 Citace Ilustrace: Kopie obrazovek programu Poznámkový blok – vlastní tvorba autora Kopie obrazovek internetového prohlížeče – vlastní tvorba autora