Tvorba www stránek Seznam, tabulky, grafika a barvy (1.část) Ing. Miroslav Vachůn, Ph.D.

Prezentace na téma: "Tvorba www stránek Seznam, tabulky, grafika a barvy (1.část) Ing. Miroslav Vachůn, Ph.D."— Transkript prezentace:

1 Tvorba www stránek Seznam, tabulky, grafika a barvy (1.část) Ing. Miroslav Vachůn, Ph.D.

2 Nečíslované seznamy, obsah první položky obsah druhé položky obsah třetí položky Atribut tagu je type - udává vzhled grafických symbolů, obsah první položky obsah druhé položky obsah třetí položky Atribut tagu je type - udává vzhled grafických symbolů type=disk - plná tečka, implicitně type=disk - plná tečka, implicitně type=circle - prázdný kroužek type=circle - prázdný kroužek type=square - čtvereček type=square - čtvereček style=list-style-image: URL(puntik.gif)

3 Číslované seznamy Atributy type type a - čísluj malými písmeny arabské abecedy a - čísluj malými písmeny arabské abecedy A - velkými písmeny arabské abecedy A - velkými písmeny arabské abecedy i - římské číslice malými písmeny i - římské číslice malými písmeny I - římské číslice velkými písmeny I - římské číslice velkými písmeny 1 - arabskými číslicemi, implicitní hodnota 1 - arabskými číslicemi, implicitní hodnota start ="počáteční hodnota" - od které poč. hodnoty má začít číslovat seznam, např. start=20, start=VII start ="počáteční hodnota" - od které poč. hodnoty má začít číslovat seznam, např. start=20, start=VII continue - zajišťuje návaznost číslování na předchozí seznam, tzn. že jestliže poslední číslovaný seznam skončil na čísle 10, potom nový seznam s atributem continue začne číslovat položky u čísla 11 continue - zajišťuje návaznost číslování na předchozí seznam, tzn. že jestliže poslední číslovaný seznam skončil na čísle 10, potom nový seznam s atributem continue začne číslovat položky u čísla 11 align=[left|right|center|justify] - určuje zarovnání položek v seznamu: vlevo, vpravo, uprostřed, na oba okraje align=[left|right|center|justify] - určuje zarovnání položek v seznamu: vlevo, vpravo, uprostřed, na oba okraje

4 Vymezení tabulky <table> Atributy Atributy border - určuje tloušťku rámečku, implicitně bývá 0 nebo 1, border=0 způsobí, že se zobrazí tabulka bez obrysových čar border - určuje tloušťku rámečku, implicitně bývá 0 nebo 1, border=0 způsobí, že se zobrazí tabulka bez obrysových čar width - definuje šířku tabulky, lze zadat absolutně v bodech, např. width=300, nebo v procentech relativně vzhledem k velikosti okna prohlížeče, např. width=50% width - definuje šířku tabulky, lze zadat absolutně v bodech, např. width=300, nebo v procentech relativně vzhledem k velikosti okna prohlížeče, např. width=50% bgcolor - definuje barvu pozadí tabulky, implicitně je tabulka "průhledná", tj. má takové pozadí, jako je aktuální pozadí dokumentu bgcolor - definuje barvu pozadí tabulky, implicitně je tabulka "průhledná", tj. má takové pozadí, jako je aktuální pozadí dokumentu cellspacing - definuje vzdalenost (v bodech) mezi jednotlivými buňkami v tabulce, implicitně je cellspacing=1 cellspacing - definuje vzdalenost (v bodech) mezi jednotlivými buňkami v tabulce, implicitně je cellspacing=1 cellpadding - definuje vzdalenost textu v buňce od okraje buňky, implicitně cellpadding=1 cellpadding - definuje vzdalenost textu v buňce od okraje buňky, implicitně cellpadding=1

5 Řádek tabulky a buňka...... hlavičková... (centrován doprostřed buňky a je tučný) hlavičková... (centrován doprostřed buňky a je tučný) normální... (normální a zarovnán standardně k levému okraji) normální... (normální a zarovnán standardně k levému okraji) Atributy buňky Atributy buňky align - zarovnání objektu v buňce, možnosti: align=left|right|center|justify align - zarovnání objektu v buňce, možnosti: align=left|right|center|justify bgcolor - nezávislá barva pozadí buňky, každá buňka může mít svou vlastní barvu bgcolor - nezávislá barva pozadí buňky, každá buňka může mít svou vlastní barvu width - definice šířky buňky v bodech, např. width=100 width - definice šířky buňky v bodech, např. width=100 nowrap - potlačuje automatické dělení řádků uvnitř buňky nowrap - potlačuje automatické dělení řádků uvnitř buňky Tabulka uvozená tagem a ukončená bude na sránce vycentrována Tabulka uvozená tagem a ukončená bude na sránce vycentrována